freedrull
freedrull

Reputation: 2254

set initial react component state in constructor or componentWillMount?

In react components is it preferred to set the initial state in the constructor() or componentWillMount()?

export default class MyComponent extends React.Component{
  constructor(props){
    super(props);
    this.setState({key: value});
  }
}

or

export default class MyComponent extends React.Component{
  componentWillMount(props){
    this.setState({key: value});
  }
}

Upvotes: 52

Views: 56403

Answers (1)

ctrlplusb
ctrlplusb

Reputation: 13137

In the constructor is preferable when using ES6 classes, but don't use the setState API, rather do like so:

export default class MyComponent extends React.Component{
  constructor(props){
    super(props);
    this.state = { key: value };
  }
}

Also, if you have class properties available to you (babel stage 1) then you can do the following:

export default class MyComponent extends React.Component{
  state = { key: value };

  render() {
    ....
  }
}

Upvotes: 79

Related Questions