how to react assign multiple refs react-hook-form

Question

I'm managing my forms using react-hook-form. but I also need to manage an element's click event. In this case, I have to set both refs

   let inputRef = useRef(null);

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

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

How can I set multiple refs

will it help? - stackoverflow.com/questions/54633690/…

s.kuznetsov
– s.kuznetsov

2021-04-24 22:49:35 +00:00
Commented Apr 24, 2021 at 22:49 — s.kuznetsov
– s.kuznetsov, Commented Apr 24, 2021 at 22:49
Thank you for trying to help. I found the answer

pneuma
– pneuma

2021-04-24 22:51:21 +00:00
Commented Apr 24, 2021 at 22:51 — pneuma
– pneuma, Commented Apr 24, 2021 at 22:51
ok, happy coding to you

s.kuznetsov
– s.kuznetsov

2021-04-24 22:53:38 +00:00
Commented Apr 24, 2021 at 22:53 — s.kuznetsov
– s.kuznetsov, Commented Apr 24, 2021 at 22:53

Rian Carlos · Accepted Answer · 2022-08-29 21:53:49Z

2

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

answered Aug 29, 2022 at 21:53

Rian Carlos

213 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Adrian Mole Over a year ago

While this code may solve the question, including an explanation of how and why this solves the problem would really help to improve the quality of your post, and probably result in more up-votes. Remember that you are answering the question for readers in the future, not just the person asking now. Please edit your answer to add explanations and give an indication of what limitations and assumptions apply.

pneuma · Accepted Answer · 2021-04-24 22:50:53Z

1

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

this is the answer

answered Apr 24, 2021 at 22:50

pneuma

3498 silver badges19 bronze badges

1 Comment

iranimij Over a year ago

It's not working for me, could you please explain more?

iranimij · Accepted Answer · 2021-11-24 06:33:37Z

0

I think it's the best solution.

const myRef = useRef(null);

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

answered Nov 24, 2021 at 6:33

iranimij

11511 bronze badges

Collectives™ on Stack Overflow

how to react assign multiple refs react-hook-form

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related