Componentes puros

Enlace de referencia: componente

La única diferencia entre React.PureComponent y React.Component es que Rect.Component no implementa shouldComponentUpdate(), mientras que React.PureComponent implementa esta función. PureComponent implementa esta función en una comparación superficial de accesorios y estado.

Si proporciona los mismos accesorios y estado a un componente de React, la función render() renderizará el mismo contenido y, en algunos casos, usar React.PureComponent puede mejorar el rendimiento.

Enlace de referencia: ponent.html#shouldcomponentupdate

Este es un método de ciclo de vida menos común

lt prepellcheck="false" class= "md- vallas md-end-block ty-contain-cm modeLoaded" lang="react" cid="n12" mdtype="fences" style="box-sizing: border-box: visible font- family: var(- -monoespacio); tamaño de fuente: 0,9 em; pantalla: bloque; interrupción: evitar; alineación de texto: espacio en blanco: normal; radio: 1px sólido 237); radio del borde: 3px; relleno: 8px 4px 6px; margen inferior: ancho: heredar; color: rgb (51, 51, 51); rgb(248, 248, 248); posición: relativa; ligaduras de variantes de fuente: normal; sangría de texto: 0px; ; transformación de texto: ninguna; viudas: 2; espacio entre palabras: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: inicial; text-decoration-color: inicial; , nextState)lt;/pregt;

Determine si la reserva del componente React se verá afectada por cambios en el estado actual o los accesorios según el valor de retorno de mustComponentUpdate(). El comportamiento predeterminado es actualizar el componente cada vez que cambia el estado. El comportamiento predeterminado es volver a renderizar el componente cada vez que cambia el estado. En la mayoría de los casos, se debe seguir el comportamiento predeterminado.

Cuando una propiedad o estado cambia, se llamará a este método antes de que se produzca la renderización. El valor de retorno predeterminado es verdadero y este método no se llama cuando el componente se representa por primera vez o cuando se usa forceUpdate().

Este método existe solo como optimización del rendimiento y no debe usarse para evitar el renderizado, ya que esto puede causar errores. Se recomienda utilizar el componente PureComponent integrado en lugar de escribir manualmente shouldComponentUpdate(). PureComponent realiza una comparación superficial de accesorios y estado, lo que reduce la posibilidad de actualizaciones innecesarias.

Si tiene que escribir esta función manualmente, puede comparar this.props y nextProps y this.state y nextState y devolver false para notificar a React que se puede omitir la actualización.

Nota: Devolver false no impide que el componente secundario se vuelva a representar cuando se actualiza el estado.

NOTA: Se recomienda encarecidamente realizar comparaciones profundas o utilizar JSON.stringfy() en shouldComponentUpdate(). Esto es ineficiente y tiene altos requisitos de rendimiento.

Nota: Actualmente, UNSAFE_componentWillUpdate(), render() y componenteDidUpdate() no se llamarán cuando deberíaComponentUpdate() devuelva falso. Las versiones posteriores pueden tratar esto como una pista en lugar de una directiva estricta. Cuando se devuelve falso, aún puede hacer que el componente se vuelva a renderizar.