Supongamos que tenemos el componente principal App y tiene un componente secundario Search .
Para este ejemplo:
El componente de Search muestra el texto escrito en su campo de entrada, a través de setState , es decir:
const Search = () => { const [searchTerm, setSearchTerm] = React.useState(""); const handleChange = (event) => { setSearchTerm(event.target.value); }; return ( <div> <label htmlFor="search">Search: </label> <input id="search" type="text" onChange={handleChange} /> <p> Searching for <strong>{searchTerm}</strong>. </p> </div> ); }; Método 1: dejar que el componente secundario Search tenga su propio estado.
¿Debería el componente de Search tener su propio estado, es decir, usar UseState() ? ¿O es una mala práctica?
Método 2: deje que la App del componente principal administre el estado del niño.
¿Se debe pasar el valor del componente de Search al componente principal App y luego dejar que el componente de la App administre el estado a través setState() y luego pasar el valor actualizado al componente de búsqueda?
¿Qué método es una mejor práctica?
Editar:
No sé por qué esta pregunta está marcada como basada en opiniones. Entiendo que habrá algún desacuerdo, pero eso sucederá cuando una pregunta gire en torno al uso del patrón de diseño correcto. Si no está de acuerdo, entonces, ¿por qué no marcar todas las preguntas de desbordamiento de pila que giran en torno a qué patrón de diseño usar, o la "base de datos/tabla SQL correcta para usar" también como opinión basada?
Si necesita el valor de la búsqueda en cualquier otro lugar de su proyecto, entonces es mejor administrar los estados de forma centralizada (si el proyecto es pequeño) o usar el gancho useContext . De lo contrario, si el componente de Search solo necesitará el valor, entonces es mejor que el estado se administre en el propio componente.
En primer lugar, ¿qué necesitas para tu proyecto? De hecho, usted está actuando sobre esta pregunta. si el componente principal usará el estado en app.js, debe pasar el estado al componente principal. pero si no es necesario, debe establecer Estado en el componente secundario.
Como regla general, el estado debe estar lo más abajo posible en la jerarquía. La razón principal para elevar más el estado es si necesita acceder al estado desde varios componentes.
Luego puede pasarlo al padre y pasárselo a varios niños. Si es necesario acceder al estado en muchos lugares, puede usar un contexto o alguna otra biblioteca de administración de estado.