Kenny Wagenknecht
Kenny Wagenknecht

Reputation: 141

How to define specific return type of react method (typescript)

I want to define a return type of a specific react component.

For Example:

Component 1

class ComponentFoo extends React.Component<any, any> {
   public render() {…}
}

Component 2

class ComponentBar extends React.Component<any, any> {
    public renderComponentFoo() : ComponentFoo { <---
      return <ComponentFoo />
    }

    public render() {
      …
      {this.renderComponentFoo()}
      …
    }
}

Is something like this possible?

Upvotes: 0

Views: 1140

Answers (1)

UncleDave
UncleDave

Reputation: 7188

Your renderComponentFoo method should return React.ReactNode instead.

JSX/TSX is just syntax sugar around React.createElement() which returns React.ReactNode. You are not returning an instance of ComponentFoo as your current code suggests.

Upvotes: 1

Related Questions