React Type Error: not assignable LegacyRef && ‘V’ refers to a value, did you mean ‘typeof V’?

RMAG news

You may encounter this kind of error when you work with third-party libraries.
I am using react-konva in my project and I passed ref to use the functions of the component.

const stageRef = useRef<Stage>(null);


<Stage ref={stageRef} />

‘Stage’ refers to a value, but is being used as a type here. Did you mean ‘typeof Stage’?

And this error happens, yes, right, the stage is a component. I should have passed a type, but it was weird… because I think I have seen from the lint that Stage needs to be passed as a type.

const stageRef = useRef<typeof Stage>(null);


<Stage ref={stageRef} />

Type ‘RefObject<KonvaNodeComponent<Stage, StageProps>>’ is not assignable to type ‘LegacyRef<Stage> | undefined’.

And then this error happened. Stage is a value, but it says I should use it as a type and then it says Stage is not a type. 🤷‍♂️

const stageRef: ComponentProps<typeof Stage>[ref] = useRef(null);

I solved the issue using ComponentProps.
Ah, Typescript…!!…

I hope someone finds it helpful!

Happy Coding!

Leave a Reply

Your email address will not be published. Required fields are marked *