Question

如何对 react-hook-form 分配多个 ref

2021-04-24

1589

javascript reactjs react-hooks

我正在使用 react-hook-form 管理我的表单。但我还需要管理元素的点击事件。在这种情况下，我必须设置两个 ref

   let inputRef = useRef(null);

   const onClick = input => {
      input.click();
   };

<input
     type="file" 
     ref={ref => {
        inputRef = ref;
        register();
     }},
     onClick={() => onClick(inputRef)}
></input>

如何设置多个 ref

Answer 1

              inputRef={ref => {
                 inputLogoSquare = ref;
                 register(ref);
              }}

这就是答案

Answer 2

const myRef = useRef<any>();
const { ref, ...rest } = register("email");
<input
   ref={(e) => {
     ref(e);
     myRef.current = e;
   }}
   {...rest}
/>

Answer 3

我认为这是最好的解决方案。

const myRef = useRef(null);

<input ref={(ref) => { 
         myRef.current = ref; 
         register(ref); 
       }} />