J6:[["$","@8",null,{"children":"¿Cuáles son las reglas de los hooks en React?"}],["$","header",null,{"className":"relative pt-10","children":[["$","div",null,{"className":"flex flex-row gap-2 pb-4","children":[["$","div",null,{"children":["$","span",null,{"className":"text-yellow-600 tracking-widest uppercase mix rounded-[4px] font-bold inline-block text-xs","children":"Intermedio"}]}],["$","@9",null,{"title":"¿Cuáles son las reglas de los hooks en React?"}]]}],["$","h1",null,{"className":"pb-8 text-3xl font-bold leading-snug text-blue-900 md:text-4xl","id":"content","children":"¿Cuáles son las reglas de los hooks en React?"}]]}],["$","article",null,{"className":"prose max-w-none pb-4 [&>hr]:hidden [&>h1]:text-3xl [&>h1]:font-bold [&>h1]:text-blue-900 [&>h1]:pb-8 [&>p]:pb-6 [&>p]:text-lg md:[&>p]:text-xl [&>p>strong]:bg-yellow-50 [&_a]:text-blue-700 [&_a:hover]:underline [&>ul>li]:list-disc [&>ul]:text-lg md:[&>ul]:text-xl [&>ul]:text-blue-900 [&>ul]:pb-4 [&>ul>li]:ml-5 [&>ul]:space-y-3 [&>pre]:overflow-x-auto [&>pre]:rounded-xl [&>pre]:text-white [&>pre]:mb-8 [&>pre]:p-8 [&>pre]:bg-slate-800","dangerouslySetInnerHTML":{"__html":"

Los hooks en React tienen dos reglas fundamentales:

Los hooks solo se pueden usar en componentes funcionales o custom hooks.
Los hooks solo se pueden llamar en el nivel superior de un componente. No se pueden llamar dentro de bucles, condicionales o funciones anidadas.

\n"}}],["$","footer",null,{"className":"py-12 clear-both text-center [&>a]:leading-snug hover:[&>a]:underline [&>a]:block [&>a]:my-2","children":[["$","@a",null,{"className":"lg:float-left","href":"/como-puedes-cancelar-una-peticion-a-una-api-en-use-effect-correctamente/#content","children":["← ","Cómo puedes cancelar una petición a una API en `useEffect` correctamente"]}],["$","@a",null,{"className":"lg:float-right","href":"/que-diferencia-hay-entre-use-effect-y-use-layout-effect/#content","children":["¿Qué diferencia hay entre `useEffect` y `useLayoutEffect`?"," →"]}]]}]]