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: src/content/community/acknowledgements.md
+1-5Lines changed: 1 addition & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -59,11 +59,7 @@ Nos gustaría reconocer a algunas personas que han hecho contribuciones signific
59
59
60
60
Esta lista no es exhaustiva.
61
61
62
-
<<<<<<< HEAD
63
-
Nos gustaría agradecer especialmente a [Tom Occhino](https://github.com/tomocchino) y [Adam Wolff](https://github.com/wolffiex) por su guía y apoyo a lo largo de los años. También estamos agradecidos con todos los voluntarios que [tradujeron React a otros idiomas.](https://translations.reactjs.org/)
64
-
=======
65
-
We'd like to give special thanks to [Tom Occhino](https://github.com/tomocchino) and [Adam Wolff](https://github.com/wolffiex) for their guidance and support over the years. We are also thankful to all the volunteers who [translated React into other languages.](https://translations.react.dev/)
66
-
>>>>>>> 2b2d0f2309f49c82cf5bb88ea62fb2e44661c634
62
+
Nos gustaría agradecer especialmente a [Tom Occhino](https://github.com/tomocchino) y [Adam Wolff](https://github.com/wolffiex) por su guía y apoyo a lo largo de los años. También estamos agradecidos con todos los voluntarios que [tradujeron React a otros idiomas.](https://translations.react.dev/)
Copy file name to clipboardExpand all lines: src/content/learn/conditional-rendering.md
+2-10Lines changed: 2 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -52,11 +52,7 @@ export default function PackingList() {
52
52
53
53
</Sandpack>
54
54
55
-
<<<<<<< HEAD
56
-
Observa que algunos de los componentes `Item` tienen su prop `isPacked` asignada a `true` en lugar de `false`. Se desea añadir una marca de verificación (✔) a los elementos empaquetados si `isPacked={true}`.
57
-
=======
58
-
Notice that some of the `Item` components have their `isPacked` prop set to `true` instead of `false`. You want to add a checkmark (✅) to packed items if `isPacked={true}`.
59
-
>>>>>>> 2b2d0f2309f49c82cf5bb88ea62fb2e44661c634
55
+
Observa que algunos de los componentes `Item` tienen su prop `isPacked` asignada a `true` en lugar de `false`. Se desea añadir una marca de verificación (✅) a los elementos empaquetados si `isPacked={true}`.
60
56
61
57
Puedes escribir esto como una declaración [`if`/`else`](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Statements/if...else) así:
62
58
@@ -206,11 +202,7 @@ return (
206
202
);
207
203
```
208
204
209
-
<<<<<<< HEAD
210
-
Puedes leerlo como *"si `isPacked` es verdadero, entonces (`?`) renderiza `name + ' ✔'`, de lo contrario (`:`) renderiza `name`"*)
211
-
=======
212
-
You can read it as *"if `isPacked` is true, then (`?`) render `name + ' ✅'`, otherwise (`:`) render `name`"*.
213
-
>>>>>>> 2b2d0f2309f49c82cf5bb88ea62fb2e44661c634
205
+
Puedes leerlo como *"si `isPacked` es verdadero, entonces (`?`) renderiza `name + ' ✅'`, de lo contrario (`:`) renderiza `name`"*)
Copy file name to clipboardExpand all lines: src/content/learn/synchronizing-with-effects.md
-4Lines changed: 0 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -627,11 +627,7 @@ See the examples below for how to handle common patterns.
627
627
628
628
### Controlar widgets que no son de React {/*controlling-non-react-widgets*/}
629
629
630
-
<<<<<<< HEAD
631
630
A veces necesitas añadir widgets UI que no estén escritos en React. Por ejemplo, digamos que añades un componente de mapa a tu página y tiene un método `setZoomLevel()` y te gustaría mantener el nivel de zoom sincronizado con una variable de estado `zoomLevel` en tu código de React. Tu Efecto se vería similar a esto:
632
-
=======
633
-
Sometimes you need to add UI widgets that aren't written in React. For example, let's say you're adding a map component to your page. It has a `setZoomLevel()` method, and you'd like to keep the zoom level in sync with a `zoomLevel` state variable in your React code. Your Effect would look similar to this:
Copy file name to clipboardExpand all lines: src/content/learn/tutorial-tic-tac-toe.md
+1-5Lines changed: 1 addition & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1135,11 +1135,7 @@ Llamar a la función `setSquares` le permite a React saber que el estado del com
1135
1135
1136
1136
<Note>
1137
1137
1138
-
<<<<<<< HEAD
1139
-
JavaScript admite [cierres](https://developer.mozilla.org/es/docs/Web/JavaScript/Closures), lo que significa que una función interna (por ejemplo, `handleClick`) tiene acceso a variables y funciones definidas en una función externa (por ejemplo, `Board`). La función `handleClick` puede leer el estado `squares` y llamar al método `setSquares` porque ambos están definidos dentro de la función `Board`.
1140
-
=======
1141
-
JavaScript supports [closures](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures) which means an inner function (e.g. `handleClick`) has access to variables and functions defined in an outer function (e.g. `Board`). The `handleClick` function can read the `squares` state and call the `setSquares` method because they are both defined inside of the `Board` function.
1142
-
>>>>>>> 2b2d0f2309f49c82cf5bb88ea62fb2e44661c634
1138
+
JavaScript admite [clausuras](https://developer.mozilla.org/es/docs/Web/JavaScript/Closures), lo que significa que una función interna (por ejemplo, `handleClick`) tiene acceso a variables y funciones definidas en una función externa (por ejemplo, `Board`). La función `handleClick` puede leer el estado `squares` y llamar al método `setSquares` porque ambos están definidos dentro de la función `Board`.
Copy file name to clipboardExpand all lines: src/content/learn/updating-objects-in-state.md
+1-5Lines changed: 1 addition & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -379,11 +379,7 @@ Ten en cuenta que la sintaxis extendida `...` es "superficial": sólo copia las
379
379
380
380
#### Utilizar un único controlador de evento para diversos campos {/*using-a-single-event-handler-for-multiple-fields*/}
381
381
382
-
<<<<<<< HEAD
383
-
También puedes utilizar las llaves `[` y `]` dentro de tu definición de objeto para especificar una propiedad con nombre dinámico. Aquí está el mismo ejemplo, pero con un solo controlador de evento en lugar de tres diferentes:
384
-
=======
385
-
You can also use the `[` and `]` braces inside your object definition to specify a property with a dynamic name. Here is the same example, but with a single event handler instead of three different ones:
386
-
>>>>>>> 2b2d0f2309f49c82cf5bb88ea62fb2e44661c634
382
+
También puedes utilizar las llaves `[` y `]` dentro de tu definición de objeto para especificar una propiedad con un nombre dinámico. Aquí está el mismo ejemplo, pero con un solo controlador de evento en lugar de tres diferentes:
Copy file name to clipboardExpand all lines: src/content/learn/you-might-not-need-an-effect.md
+2-8Lines changed: 2 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -408,15 +408,9 @@ function Game() {
408
408
409
409
Hay dos problemas con este código.
410
410
411
-
<<<<<<< HEAD
412
-
Un problema es que es muy ineficiente: el componente (y su hijo) deben volver a renderizarse entre cada llamada a `set` en la cadena. En el ejemplo anterior, en el peor caso (`setCard` → renderizado → `setGoldCardCount` → renderizado → `setRound` → renderizado → `setIsGameOver` → renderizado), hay tres renderizados innecesarios del árbol hacia abajo.
411
+
El primer problema es que es muy ineficiente: el componente (y su hijo) deben volver a renderizarse entre cada llamada a `set` en la cadena. En el ejemplo anterior, en el peor caso (`setCard` → renderizado → `setGoldCardCount` → renderizado → `setRound` → renderizado → `setIsGameOver` → renderizado), hay tres renderizados innecesarios del árbol hacia abajo.
413
412
414
-
Incluso si no fuera lento, a medida que evoluciona tu código, te encontrarás con casos en los que la "cadena" que escribiste no se ajusta a los nuevos requisitos. Imagina que estás agregando una forma de recorrer el historial de los movimientos del juego. Lo harías actualizando cada variable de estado a un valor del pasado. Sin embargo, establecer el estado de `card` a un valor del pasado volvería a activar la cadena de Efectos y cambiaría los datos que estás mostrando. Este tipo de código suele ser rígido y frágil.
415
-
=======
416
-
The first problem is that it is very inefficient: the component (and its children) have to re-render between each `set` call in the chain. In the example above, in the worst case (`setCard` → render → `setGoldCardCount` → render → `setRound` → render → `setIsGameOver` → render) there are three unnecessary re-renders of the tree below.
417
-
418
-
The second problem is that even if it weren't slow, as your code evolves, you will run into cases where the "chain" you wrote doesn't fit the new requirements. Imagine you are adding a way to step through the history of the game moves. You'd do it by updating each state variable to a value from the past. However, setting the `card` state to a value from the past would trigger the Effect chain again and change the data you're showing. Such code is often rigid and fragile.
419
-
>>>>>>> 2b2d0f2309f49c82cf5bb88ea62fb2e44661c634
413
+
El segundo problema es que aunque no fuera lento, a medida que evoluciona tu código, te encontrarás con casos en los que la "cadena" que escribiste no se ajusta a los nuevos requisitos. Imagina que estás agregando una forma de recorrer el historial de los movimientos del juego. Lo harías actualizando cada variable de estado a un valor del pasado. Sin embargo, establecer el estado de `card` a un valor del pasado volvería a activar la cadena de Efectos y cambiaría los datos que estás mostrando. Este tipo de código suele ser rígido y frágil.
420
414
421
415
En este caso, es mejor calcular lo que puedas durante el proceso de renderizado y ajustar el estado en el controlador de eventos:
0 commit comments