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: content/docs/reference-react-component.md
+3-35
Original file line number
Diff line number
Diff line change
@@ -38,11 +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
-
<<<<<<< HEAD
42
-
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.
43
-
=======
44
-
Each component has several "lifecycle methods" that you can override to run code at particular times in the process. **You can use [this lifecycle diagram](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) as a cheat sheet.** In the list below, commonly used lifecycle methods are marked as **bold**. The rest of them exist for relatively rare use cases.
45
-
>>>>>>> 8f7ffa473905148fd5c7ecfd7fed5dabbd261bf0
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.
46
42
47
43
#### Montaje {#mounting}
48
44
@@ -112,11 +108,7 @@ Cada componente también proporciona algunas otras APIs:
112
108
113
109
### Funciones del ciclo de vida usadas comúnmente {#commonly-used-lifecycle-methods}
114
110
115
-
<<<<<<< HEAD
116
-
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/).**
117
-
=======
118
-
The methods in this section cover the vast majority of use cases you'll encounter creating React components. **For a visual reference, check out [this lifecycle diagram](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/).**
119
-
>>>>>>> 8f7ffa473905148fd5c7ecfd7fed5dabbd261bf0
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/).**
120
112
121
113
### `render()` {#render}
122
114
@@ -250,15 +242,9 @@ componentWillUnmount()
250
242
251
243
* * *
252
244
253
-
<<<<<<< HEAD
254
245
### Métodos de ciclo de vida raramente utilizados {#rarely-used-lifecycle-methods}
255
-
=======
256
-
### Rarely Used Lifecycle Methods {#rarely-used-lifecycle-methods}
257
246
258
-
The methods in this section correspond to uncommon use cases. They're handy once in a while, but most of your components probably don't need any of them. **You can see most of the methods below on [this lifecycle diagram](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) if you click the "Show less common lifecycles" checkbox at the top of it.**
259
-
>>>>>>> 8f7ffa473905148fd5c7ecfd7fed5dabbd261bf0
260
-
261
-
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.**
Este método existe para [casos de uso raros](/blog/2018/06/07/you-probably-dont-need-derived-state.html#when-to-use-derived-state) donde el estado depende de los cambios en props con el tiempo. Por ejemplo, puede ser util para implementar un componente `<Transition>` que compare su anterior hijo y el siguiente para decidir cual de los dos animar en la entrada y salida.
292
278
293
-
<<<<<<< HEAD
294
279
Derivar el estado conduce al código verboso y hace que tus componentes sean difíciles de pensar.
295
280
[Asegúrate de que estás familiarizado con alternativas más simples](/blog/2018/06/07/you-probably-dont-need-derived-state.html)
296
-
=======
297
-
Deriving state leads to verbose code and makes your components difficult to think about.
298
-
[Make sure you're familiar with simpler alternatives:](/blog/2018/06/07/you-probably-dont-need-derived-state.html)
299
-
>>>>>>> 8f7ffa473905148fd5c7ecfd7fed5dabbd261bf0
300
281
301
282
* Si necesitas **realizar un efecto secundario** (por ejemplo, obtención de datos o animaciones) en una respuesta debido a un cambio en las props, utiliza [`componentDidUpdate`](#componentdidupdate).
302
283
@@ -340,15 +321,9 @@ Usa solo límites de error para recuperar excepciones inesperadas; no intentes u
340
321
341
322
Para mas detalles ve el [*Manejo de Errores en React 16*](/blog/2017/07/26/error-handling-in-react-16.html).
342
323
343
-
<<<<<<< HEAD
344
324
> Nota
345
325
>
346
326
> Los limites de error solo capturan errores en los componentes **debajo** de ellos en el árbol. Un límite de error no puede capturar un error dentro de él mismo.
347
-
=======
348
-
> Note
349
-
>
350
-
> Error boundaries only catch errors in the components **below** them in the tree. An error boundary can’t catch an error within itself.
@@ -432,16 +407,9 @@ class ErrorBoundary extends React.Component {
432
407
}
433
408
```
434
409
435
-
<<<<<<< HEAD
436
410
> Nota
437
411
>
438
412
> En el evento de un error, puedes renderizar una interfaz de usuario con `componentDidCatch()` llamando a `setState()`, pero esto estará obsoleto en una futura versión. Usa `static getDerivedStateFromError()` para controlar el plan de renderizado.
439
-
=======
440
-
> Note
441
-
>
442
-
> In the event of an error, you can render a fallback UI with `componentDidCatch()` by calling `setState`, but this will be deprecated in a future release.
443
-
> Use `static getDerivedStateFromError()` to handle fallback rendering instead.
0 commit comments