Estoy pasando el estado (setActive) al componente ButtonsOur. Además, a través de la devolución de llamada, paso setActive al HOC, pero aparece este error "Error de tipo no detectado: setActive no es una función". ¿Por qué no funciona y cómo puedo solucionarlo? En ButtonsNuestro componente estoy pasando setActive desde el componente principal a través de accesorios
Este es mi componente ButtonsOur
import HOC from '../../../hoc/HocPopUp'; function ButtonsOur({ setActive, open }) { return ( <div className="base__routes__button"> <Buttons className="base__button__moreInf open-popup-exc" Click={open(setActive)}>Докладніше</Buttons> <Buttons className="base__button__moreInf open-popu p-exc" Click={open(setActive)}>Забронювати</Buttons> </div> ); } export default HOC(ButtonsOur);Y este es mi HOC
const HOC = (Component) => { function HandleChange(props) { function open(setActive) { setActive(true); } function close(setActive) { setActive(false); } return ( <Component close={() => close} open={() => open} // eslint-disable-next-line react/jsx-props-no-spreading {...props} /> ); } return HandleChange; }; export default HOC;El HOC no está leyendo setActive , open desde los accesorios pasados.
También debe pasar los accesorios originales desde el principio y hacer que los accesorios en el HOC los anulen cuando sea necesario.
const HOC = (Component) => { function HandleChange(originalProps) { function open(setActive) { originalProps.setActive(true); } function close(setActive) { originalProps.setActive(false); } return ( <Component // eslint-disable-next-line react/jsx-props-no-spreading {...originalProps} close={close} open={open} /> ); } return HandleChange; };