¿Por qué recibo este error?
Uncaught Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.**Este es mi código:
const [roles, setRoles] = useState([]); useLayoutEffect(() => { setRoles(["5nxg5wvb"]); });Tenga en cuenta que aparece el mismo error cuando uso useEffect, y ese error solo desaparece cuando cambio el código a esto:
useLayoutEffect(() => { setRoles("5nxg5wvb"); });Cualquier ayuda sería apreciada...
Debe proporcionar una matriz de dependencia en setEffect o se ejecutará encada cambio de estado . Dado que está cambiando de estado, eso significa que se ejecutará, lo que hace que se ejecute de nuevo, lo que hace que se ejecute de nuevo, etc.
La matriz de dependencia le dice cuándo ejecutar. Una matriz vacía significa "ejecutar este efecto en el montaje", por lo que solo se ejecutará una vez. Una matriz con nombres de variables significa "ejecutar cuando cambie cualquiera de estas variables".
useLayoutEffect(() => { setRoles("5nxg5wvb"); }, []); Debido a que está utilizando useEffect o useLayoutEffect mientras no especifica los segundos parámetros de los ganchos, solo coloca el primer parámetro, que es la función de devolución de llamada, y el valor del estado siempre es diferente.
["5nxg5wvb"] no funciona mientras que poner "5nxg5wvb" funciona?[] (una matriz), crea un nuevo objeto y lo compara con el objeto anterior cada vez que se vuelve a renderizar (porque no especifica los segundos parámetros de los ganchos, pero sabe que [] === [] dará como resultado un valor false )"" (una cadena), React comparará directamente el valor en su lugar, y si es el mismo, el estado no se actualizará y no habrá una nueva representación. useLayoutEffect(() => { setRoles(["5nxg5wvb"]); }, []);useState de esta manera, no es necesario colocar useEffect con datos estáticos: const [roles, setRoles] = useState(["5nxg5wvb"]);Si ambas sugerencias no funcionan para su caso de uso, ingrese más información sobre su caso de uso.