• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
    • Questions
    • Teachers
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

174
Views
Asignación de valor en la declaración useState() frente a useEffect()

He estado usando estas dos formas indistintamente, sin embargo, no estoy seguro de cuál es la más correcta. su comportamiento parece ser el mismo, pero estoy seguro de que hay un caso de uso para cada uno. ¿Alguien puede ayudarme a entender cuál es el uso adecuado para cada caso?

 const [customer, setCustomers] = useState(props.location.state);
 useEffect(() => { setCustomers(props.location.state); }, []);
almost 3 years ago · Santiago Gelvez
3 answers
Answer question

0

Normalmente debería ceñirse a la primera. Llamar al setter de useState puede generar renderizaciones no deseadas y una disminución del rendimiento.

En el primer bloque, el cliente se inicializa directamente y no se vuelve a procesar. El método setCustomer cambiará el estado y volverá a representar el componente. Al final, toda la función se ejecutará dos veces, lo que puede verificar con un console.log .

 const [customer, setCustomers] = useState(0); useEffect(() => { setCustomers(15); }, []); console.log(customer) // will first output 0 and then 15
almost 3 years ago · Santiago Gelvez Report

0

Suponiendo que en el segundo caso, tiene esto como su declaración useState :

 const [customer, setCustomers] = useState();

El segundo establece el valor del cliente en componentDidMount . Entonces, en el renderizado inicial, no tendrá el valor apropiado en su variable de customer . Pero sí, muy poco después se establecerá el valor correcto debido al código escrito en useEffect .

Para aclararlo, habrá 2 representaciones aquí (porque el valor de la variable de estado cambia). En el primero, ese no será el caso ya que la variable de estado tiene un solo valor desde el principio.

almost 3 years ago · Santiago Gelvez Report

0

El primero es más efectivo.

 const [customer, setCustomers] = useState(props.location.state);

Si usa el segundo (usando useEffect ), su componente se volverá a renderizar.

Es decir, su customer de variable de estado se actualizará en useEffect después de que DOM se represente inicialmente, esto conduce a la segunda representación del componente.

Pero si desea que customer sea actualizado por props.location.state , debe agregar el useEffect como el siguiente.

 useEffect(()=> { setCustomers(props.location.state); }, [props.location.state]);
almost 3 years ago · Santiago Gelvez Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error