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

[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.

[IssueHuntBot]

@issuehuntfest has funded $20.00 to this issue. See it on IssueHunt

[IssueHuntBot]

@IssueHunt has funded $20.00 to this issue.

---

• Submit pull request via IssueHunt to receive this reward.
• Want to contribute? Chip in to this issue via IssueHunt.
• Checkout the IssueHunt Issue Explorer to see more funded issues.
• Need help from developers? Add your repository on IssueHunt to raise funds.

[isolin]

I am facing the same problem. Any solution / work around so far?