joedotnot
joedotnot

Reputation: 5153

Is React super(props) deprecated?

I've always used something similar to

class MyComponent extends React.Component {
    constructor(props) {
        super(props)
        
        this.state = {
            var1 : undefined,
            var2 : 'etc...',
        }
    }
}

But today I noticed while working in VS Code there is a strike-thru line on super(props), which was never there before !?

enter image description here What has changed? (the link to the docs in the popup is not very helpful)

Upvotes: 27

Views: 12562

Answers (5)

bladerunner2020
bladerunner2020

Reputation: 318

It looks like a bug. Please see - here for explanation and there is a link to a source.

Upvotes: 13

Amit Baderia
Amit Baderia

Reputation: 4892

super(props) is not been deprecated. See the official doc - https://reactjs.org/docs/react-component.html#constructor

This is not an error actually. This is a bug related to the code editor, Typescript and React. You can read here - https://github.com/microsoft/TypeScript/issues/40511

The good news is this is resolved. You can find the solution here - https://github.com/DefinitelyTyped/DefinitelyTyped/pull/47784

Upvotes: 0

Frank
Frank

Reputation: 121

Seems to be a bug. If you update your "@types/react" it will solve the problem.

npm install --dev @types/react

when you your code on the @latest

npm install --also=dev @types/react

Upvotes: 4

Guruprasad Tupe
Guruprasad Tupe

Reputation: 11

Use just super() instead of super(props)

super(props) :

  • By using this, we can access and use this.props object in the constructor.

super() :

  • If you are not using this.props in the constructor there is no need to pass props to the super().

  • Instead of this.props, you can always use props.

  • It’s okay to not pass props to super as irrespective of passing it to super, this.props is still available inside render function.

    class MyComponent extends React.Component {
        constructor(props) {
            super();
    
            this.state = {
                 var1 : undefined,
                 var2 : 'etc...',
            };
        }
    }
    

Upvotes: -5

Scotty Jamison
Scotty Jamison

Reputation: 13239

My guess is that your editor is showing you the description for the super(props, context) signature which is deprecated. That link it's pointing to is all about how the old context API is going away, and that particular call signature is part of what is leaving.

However, I haven't heard of a plain super(props) going away, you should be safe to continue using that.

Upvotes: 18

Related Questions