Skip to content

How to safely access instance properties declared in a class component with createRef #108

Open
@urielvan

Description

@urielvan

I have a child component connected by redux

class Child extends React.Component {
    foo () {}
}

export default connect()(Child);

and a parent contains it

class Parent extends React.Component {
    private childRef: React.RefObject<Child> = React.createRef()

    bar () {
        if (this.childRef.current) {
            /*
             * here typescript complains that 
             * Property 'foo' does not exist on
             * type 'ConnectedComponentClass<typeof Child...'
             */
            this.childRef.current.foo();
        }
    }

    render () {
        return (
            <Child ref={this.childRef} />
        );
    }
}

I've tried to set the generic type

<React.ComponentType<Child>>

explicitly when exporting child component, but still not working.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions