0

Need: want to pass props & forwardRef to child component

MVCE: this is what I get when I try this on stackblitz - the reference inside the child is null - but no error (like below)...

But, the error I am getting in a codebase enter image description here

would appreciate an answer/link which can explain this clearly and help resolve this - the examples I saw passed props only or forwardRef only; And on stackblitz, it worked also;

2

1 Answer 1

4

You have mixed up the order of the type arguments. forwardRef signature looks like this: function forwardRef<T, P = {}> where T is the ref type and P the props type.

Change your code like so:

export const DivField = forwardRef<HTMLDivElement, any>((props, ref) => {
  console.log("DivField:", props, " -- ref:", ref);
  return <div ref={ref}>this is the div field only </div>;
});
DivField.displayName = "DivField";

Link to Stackblitz

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

2 Comments

there is no error on stackblitz, the error comes on my local repo... i am unable to recreate the issue on stackblitz as it is...
your stackblitz configuration used old @types with latest react and react-dom, once I upgraded (see my package.json) I got the same error on stackblitz

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.