You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: .github/PULL_REQUEST_TEMPLATE.md
+9
Original file line number
Diff line number
Diff line change
@@ -1,5 +1,14 @@
1
+
Note to Hacktoberfest 🎃 participants:
1
2
3
+
While we appreciate the enthusiasm, we are experiencing a high volume of drive-by pull requests (one-line changes, README tweaks, etc.). Please remember that hundreds of people are subscribed to this repo and will receive notifications for these PRs. Spam submissions will be closed and won't count towards your Hacktoberfest goals.
2
4
5
+
Please search for issues tagged [`good first issue`][gfi] or [`hacktoberfest`][hacktoberfest] to find things to work on.
Cuando Webpack se encuentra esta sintaxis, comienza a dividir el código de tu
88
88
aplicación automáticamente. Si estás usando Create React App, esto ya viene
89
-
configurado para ti y puedes comenzar a [usarlo](https://facebook.github.io/create-react-app/docs/code-splitting). También es compatible por defecto en [Next.js](https://nextjs.org/docs/advanced-features/dynamic-import).
89
+
configurado para ti y puedes comenzar a [usarlo](https://create-react-app.dev/docs/code-splitting/). También es compatible por defecto en [Next.js](https://nextjs.org/docs/advanced-features/dynamic-import).
90
90
91
91
Si configuras Webpack por ti mismo, probablemente vas a querer leer la [guía sobre división de código](https://webpack.js.org/guides/code-splitting/) de Webpack. Tu configuración de Webpack debería verse vagamente [como esta](https://gist.github.com/gaearon/ca6e803f5c604d37468b0091d9959269).
92
92
93
-
Cuando uses [Babel](https://babeljs.io/), tienes que asegurarte de que Babel reconozca la sintaxis de `import()` dinámico pero no la transforme. Para ello vas a necesitar el [babel-plugin-syntax-dynamic-import](https://yarnpkg.com/es-ES/package/babel-plugin-syntax-dynamic-import).
93
+
Cuando uses [Babel](https://babeljs.io/), tienes que asegurarte de que Babel reconozca la sintaxis de `import()` dinámico pero no la transforme. Para ello vas a necesitar el [@babel/plugin-syntax-dynamic-import](https://classic.yarnpkg.com/en/package/@babel/plugin-syntax-dynamic-import).
Copy file name to clipboardExpand all lines: content/docs/conditional-rendering.md
+13
Original file line number
Diff line number
Diff line change
@@ -147,6 +147,19 @@ Esto funciona porque en JavaScript, `true && expresión` siempre evalúa a `expr
147
147
148
148
Por eso, si la condición es `true`, el elemento justo después de `&&` aparecerá en el resultado. Si es `false`, React lo ignorará.
149
149
150
+
Ten en cuenta que retornar expresiones falsas hará que el elemento después de '&&' sea omitido pero retornará el valor falso. En el ejemplo de abajo, '<div>0</div>' será retornado por el método de renderizado.
151
+
152
+
```javascript{2,5}
153
+
render() {
154
+
const count = 0;
155
+
return (
156
+
<div>
157
+
{ count && <h1>Messages: {count}</h1>}
158
+
</div>
159
+
);
160
+
}
161
+
```
162
+
150
163
### If-Else en una línea con operador condicional {#inline-if-else-with-conditional-operator}
151
164
152
165
Otro método para el renderizado condicional de elementos en una línea es usar el operador condicional [`condición ? true : false`](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/Conditional_Operator) de JavaScript.
Copy file name to clipboardExpand all lines: content/docs/reference-react-component.md
+3-3
Original file line number
Diff line number
Diff line change
@@ -38,7 +38,7 @@ El único método que *debes* definir en una subclase de `React.Component` es [`
38
38
39
39
### El ciclo de vida del componente {#the-component-lifecycle}
40
40
41
-
Cada componente tiene varios "métodos de ciclo de vida" que puedes sobrescribir para ejecutar código en momentos particulares del proceso. **Puedes usar [este diagrama de ciclo de vida](http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) como una hoja de referencia.** En la lista de abajo, los métodos de ciclo de vida comúnmente usados están marcados en **negrita**. El resto de ellos existen para casos de uso relativamente raros.
41
+
Cada componente tiene varios "métodos de ciclo de vida" que puedes sobrescribir para ejecutar código en momentos particulares del proceso. **Puedes usar [este diagrama de ciclo de vida](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) como una hoja de referencia.** En la lista de abajo, los métodos de ciclo de vida comúnmente usados están marcados en **negrita**. El resto de ellos existen para casos de uso relativamente raros.
42
42
43
43
#### Montaje {#mounting}
44
44
@@ -108,7 +108,7 @@ Cada componente también proporciona algunas otras APIs:
108
108
109
109
### Funciones del ciclo de vida usadas comúnmente {#commonly-used-lifecycle-methods}
110
110
111
-
Los métodos que verás en esta sección cubren la gran mayoría de casos de uso que encontrarás cuando crees componentes en React. **Para una referencia visual, revisa [este diagrama de los ciclos de vida](http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/).**
111
+
Los métodos que verás en esta sección cubren la gran mayoría de casos de uso que encontrarás cuando crees componentes en React. **Para una referencia visual, revisa [este diagrama de los ciclos de vida](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/).**
112
112
113
113
### `render()` {#render}
114
114
@@ -244,7 +244,7 @@ componentWillUnmount()
244
244
245
245
### Métodos de ciclo de vida raramente utilizados {#rarely-used-lifecycle-methods}
246
246
247
-
Los métodos de esta sección corresponden a casos de uso poco común. Son útiles alguna vez, pero la mayoría de sus componentes probablemente no necesitan ninguno de ellos. **Puedes ver la mayoría de los métodos a continuación en [este diagrama de ciclo de vida](http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) si haces clic en la casilla de verificación "Mostrar ciclos de vida menos comunes" en la parte superior de él.**
247
+
Los métodos de esta sección corresponden a casos de uso poco común. Son útiles alguna vez, pero la mayoría de sus componentes probablemente no necesitan ninguno de ellos. **Puedes ver la mayoría de los métodos a continuación en [este diagrama de ciclo de vida](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) si haces clic en la casilla de verificación "Mostrar ciclos de vida menos comunes" en la parte superior de él.**
Copy file name to clipboardExpand all lines: content/docs/typechecking-with-proptypes.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -30,7 +30,7 @@ Greeting.propTypes = {
30
30
};
31
31
```
32
32
33
-
En este ejemplo, estamos usando un componente de clase, pero la misma funcionalidad también se podría aplicar a componentes de función, o componentes creados por [`React.memo`](https://es.reactjs.org/docs/react-api.html#reactmemo) o [`React.forwardRef`](https://es.reactjs.org/docs/react-api.html#reactforwardref).
33
+
En este ejemplo, estamos usando un componente de clase, pero la misma funcionalidad también se podría aplicar a componentes de función, o componentes creados por [`React.memo`](/docs/react-api.html#reactmemo) o [`React.forwardRef`](/docs/react-api.html#reactforwardref).
34
34
35
35
`PropTypes` exporta un rango de validadores que pueden ser usados para estar seguros que la información recibida sea válida. En este ejemplo, usamos `PropTypes.string`. Cuando un valor inválido se asigna a una prop, se muestra una advertencia en la consola de Javascript. Por razones de desempeño, `PropTypes` solo se verifica en modo desarrollo.
0 commit comments