Estoy tratando de crear una superposición de imagen sin desplazamiento y, por lo tanto, necesito diseñar el body
cuando mi li
está activo. Estoy tratando de hacer esto a través de Helmet
, pero no funciona. Simplemente dice <body class="">
en el navegador, sin importar si un li
está activo o no.
El componente:
import React, { useState } from "react" import { Helmet } from "react-helmet" export default function ToggleActive({ children, size }) { const [isActive, setActive] = useState("false") const handleToggle = () => { setActive(!isActive) } return ( <li className={isActive ? size : "active"} onClick={handleToggle}> <Helmet> <body className={isActive ? null : "no-scroll"} /> </Helmet> {children} <button onClick={handleToggle} /> </li> ) }
¿Qué pasa aquí?