Typescript support for Refs
October 17, 2018 at 6:28amTypescript support for Refs
October 17, 2018 at 6:28amHey Guys! Congrats on v4!
Been migrating the codebase to v4 and refractoring the use of
innerRef to just refBut there is an incomprehensible (may be because I'm new) type error.
container = React.createRef<HTMLDivElement>();<Container ref={this.container}><p>Text</p></Container>
What should I be giving out the type of component as?
See a demo https://codesandbox.io/s/0p9wqmw24w
August 1, 2019 at 6:46pm
Hi , did you ever figure this one out? Upgrading to v4 today and my refs are all breaking.
Type 'RefObject<HTMLDivElement>' is not assignable to type 'string | (string & ((instance: HTMLDivElement | null) => any)) | (((instance: Component<ThemedOuterStyledProps<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DefaultTheme>, ComponentState> | null) => any) & string) | (((instance: Component<...> | null) => any) & ((instance: HTMLDivElement | null)...'.Type 'RefObject<HTMLDivElement>' is not assignable to type '((instance: Component<ThemedOuterStyledProps<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DefaultTheme>, ComponentState> | null) => any) & ((instance: HTMLDivElement | null) => any)'.Type 'RefObject<HTMLDivElement>' is not assignable to type '(instance: Component<ThemedOuterStyledProps<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DefaultTheme>, ComponentState> | null) => any'.Type 'RefObject<HTMLDivElement>' provides no match for the signature '(instance: Component<ThemedOuterStyledProps<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DefaultTheme>, ComponentState> | null): any'.ts(2322)index.d.ts(89, 9): The expected type comes from property 'ref' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<ThemedOuterStyledProps<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DefaultTheme>, ComponentState>> & Readonly<...> & Readonly<...>'
For now I'm just typing all refs as
anyAlso having to do
styled(Dropdown as any) instead of styled(Dropdown)August 2, 2019 at 11:53am
August 2, 2019 at 8:30pm