杂谈

传递 React 的特殊属性 ref

2023-10-26  本文已影响0人  LXEP

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>
    </>
  );
}
上一篇下一篇

猜你喜欢

热点阅读