Actualmente, estoy usando react-slick para implementarlo. Quiero acceder al control deslizante con useref (ref.cuurent), pero en el momento en que se abre el modal, se vuelve nulo. Puede acceder a él deslizándolo. Creo que probablemente sea porque estoy accediendo a él dentro de un modal. ¿Cómo obtengo una referencia actual en el momento en que se abre el modal?
export const index: React.FC = () => { const [isShowHowToModal, setIsHowToModal] = useState(true) return ( <Box> <div>hello</div> {isShowHowToModal && <Modal setIsHowToModal={setIsHowToModal} />} </Box> ) } import Slider from 'react-slick' export const Modal = React.FC<Props>(setIsModal) => { const onClickCancel = () => { setIsModal(false) } const refs = useRef<Slider>(null) console.log(refs) const settings = { dots: false, infinite: false, speed: 500, slidesToShow: 1, slidesToScroll: 1, } return ( <Slider ref={refs} {...settings}> <div>aaa</div> <div>bbb</div> <div>ccc</div> </Slider> }Sería útil si pudiera responder con el componente de función.
Intente acceder a la referencia dentro del gancho useEffect, ahora mismo lo está registrando en el primer procesamiento antes de que se procese el control deslizante.
En su ejemplo, tiene múltiples errores sintácticos, pueden o no ser la razón por la que tiene un problema. De todos modos, echa un vistazo a este sandbox , echa un vistazo a la consola, registra con éxito las refs .
Nota al margen: si exporta React.FC index con nombre y lo usa así <index> </index> no representará el componente, sino que intentará encontrar un elemento dom "indexado".