Soy nuevo en React y estoy tratando de agregar un editor de texto a un componente emergente con accesorios como visibilidad. La idea es convertirlo en un componente que cambie su visibilidad por valor de utilería. Intenté usar useEffect para cambiar el estado de los accesorios, sin embargo, la visibilidad no actualiza el estado. ¿Alguna idea de por qué esto no funciona?
export default function My_editor_popup({visibility_in}) { const [visibility, setVisibility] = useState(visibility_in); const popupCloseHandler = () => { setVisibility(false); }; useEffect(() => { setVisibility(visibility_in); }, [visibility_in]); return ( <div> <MyPopup onClose={popupCloseHandler} show={visibility} title="Editor"> <My_editor text={""}/> </MyPopup> </div> ) }Según tengo entendido, está utilizando accesorios, luego intente mapear su valor a un estado usando useState y useEffect, luego use ese estado para controlar la visibilidad emergente. Creo que está complicando los problemas, porque simplemente podría usar el accesorio para controlar la visibilidad como se muestra a continuación.
//set visibility is a function which could change value of visibility of parent component export default function My_editor_popup({visibility, setVisibility}) { const popupCloseHandler = () => { setVisibility(false); }; return ( <div> <MyPopup onClose={popupCloseHandler} show={visibility} title="Editor"> <My_editor text={""}/> </MyPopup> </div> ) }No necesita un useState en este caso, solo puede usar el accesorio directamente. Deberá proporcionar una función para manejar onClose.
export default function My_editor_popup( { visibility_in, closeHandler} ) { return ( <div> <MyPopup onClose={closeHandler} show={visibility_in} title="Editor"> <My_editor text={""}/> </MyPopup> </div> ) }