¿Hay alguna diferencia entre tener el estado del componente agrupado como un solo objeto como este (1)
const [state, setState] = useState({ title: 'Jerome Is Coming!', year: '1998' })versus tener un estado separado con valores primitivos para rastrear el estado de cada componente, como este (2)
const [title, setTitle] = useState('Jerome Is Coming!') const [year, setYear] = useState('1998')?
Editar: conozco el patrón de uso sugerido . Para agregar a esta pregunta, lo que quiero saber es si hay alguna diferencia en términos de rendimiento en tiempo de ejecución al hacerlo de una manera en lugar de la otra, especialmente si mi objeto de estado es enorme.
¿Actualizar solo un estado miembro costará lo mismo que actualizar todo el objeto de estado? Si no es lo mismo, ¿es significativa la diferencia?
Según la documentación oficial de React, debemos agrupar las variables de estado (objeto) cuando los valores tienden a cambiar juntos.
Sin embargo, recomendamos dividir el estado en múltiples variables de estado en función de qué valores tienden a cambiar juntos.
Más detalles aquí: ¿Debo usar una o varias variables de estado?
Referencias:
En realidad, según el concepto de state , no hay diferencia entre ellos y solo sus datos son diferentes. Como resultado, su interacción con el estado sería diferente según el objeto provisto. Por ejemplo, si solo tiene un parámetro en su estado, como:
const [title, setTitle] = useState('Jerome Is Coming!')cuando actualiza su valor de la siguiente manera:
setTitle("test");reemplazará el título anterior por el siguiente. Por el contrario, ha proporcionado un objeto como el siguiente:
const [state, setState] = useState({ title: 'Jerome Is Coming!', year: '1998' })puede actualizar solo uno de ellos y mantener el resto igual que el estado anterior de la siguiente manera:
setState({...state, year: '2010'}); esto solo afectará el parámetro del year y el title seguirá siendo el mismo. Personalmente, prefiero usar object en lugar de parámetros primitive , porque puedes configurarlos simultáneamente cuando lo necesites.