美文网首页杂谈
传递 React 的特殊属性 ref

传递 React 的特殊属性 ref

作者: LXEP | 来源:发表于2023-10-26 09:26 被阅读0次

    ref 属性是 React 的特殊属性,不能直接传递使用。

    借助 forwardRef 转发 ref 属性

    举例如下:

    import { forwardRef, useRef } from "react";
    
    const InputCom = forwardRef((props, ref) => {
      return <input type="text" ref={ref} />;
    });
    
    export default function ProRef() {
      const inpRef = useRef(null);
    
      const focus = () => {
        inpRef.current?.focus();
      };
    
      return (
        <>
          <InputCom ref={inpRef} />
          <br />
          <button onClick={focus}>focus</button>
        </>
      );
    }
    

    相关文章

      网友评论

        本文标题:传递 React 的特殊属性 ref

        本文链接:https://www.haomeiwen.com/subject/tpckjctx.html