super() OR super(props) -- What's The Difference

来源:互联网 发布:易经软件 知乎 编辑:程序博客网 时间:2024/06/03 21:23

Questions:
When is it important to pass props to super(), and why ?

class MyComponent extends React.Component {  constructor(props) {    super(); // or super(props) ?  }}

Answer :

There is only one reason when one needs to pass props to super() :

When you want to access this.props in constructor.

Passing:

class MyComponent extends React.Component {        constructor(props) {        super(props)        console.log(this.props)        // -> { icon: 'home', … }    }}

Not passing:

class MyComponent extends React.Component {        constructor(props) {        super()        console.log(this.props)        // -> undefined        // Props parameter is still available        console.log(props)        // -> { icon: 'home', … }    }    render() {        // No difference outside constructor        console.log(this.props)        // -> { icon: 'home', … }    }}

Note that passing or not passing props to super has no effect on later uses of this.props outside constructor. That is render, shouldComponentUpdate, or event handlers alwayshave access to it.

Ben Alpert from React team:
If you want to use this.props in the constructor, you need to pass props to super. Otherwise, it doesn't matter because React sets .props on the instance from the outside immediately after calling the constructor.

原创粉丝点击