¿Que es React?
Es una libreria (desarrollada con JavaScript) para construir interfaces.
Ciclo de vida de los componentes en React
Montado
1. constructor (el componente aún no se ha renderizado)
Es el metodo que se llama antes de montar el componente. En este metodo se puede iniciar estados, usar bind.
2. componentWillMount (el componente esta a punto de ser renderizado)
Llamado inmediatamente antes de renderizar el componente. No se puede hacer un setState() y no se recomienda hacer en este metodo realizar llamadas a un API o suscripción a eventos.
3. render (estructura del componente)
Contiene todos los elementos a renderizar. Retorna un JSX.
4. componentDidMount (el componente ya se ha renderizado)
Este metodo es llamado a penas el componente es renderizado. En este punto ya puedes usar las API del navegador 😃
Actualización
1. componentWillReceiveProps (el componente aún no se ha re-renderizado)
Este metodo es llamado cuando el componente recibe nuevas propiedades, es útil para actualizar el estado basado en nuevas propiedades.
2. shouldComponentUpdate (el componente aún no se ha re-renderizado)
Este metodo condiciona el re-render del componente, verifica si las nuevas propiedades son iguales a las actuales. Usado para optimizar el rendimiento.
3. componentWillUpdate (el componente esta a punto de ser re-renderizado)
Este metodo es llamado si shouldComponentUpdate es true. Se ejecuta antes de re-renderizar (nuevamente) el componente.
4. render (nueva estructura del componente)
Contiene todos los elementos a renderizar. Retorna un JSX.
5. componentDidUpdate (el componente ya se ha re-renderizado)
Este metodo es llamado a penas el componente es re-renderizado. En este punto ya puedes usar las API del navegador 😃
Desmontado
1. componentWillUnmount
Este metodo es llamado antes de que el componente sea retirado de la aplicacion.
Manejo de errores (a partir de React 16)
1. componentDidCatch
Este metodo es ejecutado en caso de ocurrir un error al renderizar el componente. Afecta a los componentes hijos. El componente padre informa si el componente hijo falló.
¡Gracias por leer!
Curso de React.js 2017
