Enforce class component state initialization style (`react/state-in-constructor`)

Rule Details

This rule will enforce the state initialization style to be either in a constructor or with a class property.

Rule Options

...
"react/state-in-constructor": [<enabled>, <mode>]
...

`always` mode

Will enforce the state initialization style to be in a constructor. This is the default mode.

Examples of incorrect code for this rule:

class Foo extends React.Component {
  state = { bar: 0 }
  render() {
    return <div>Foo</div>
  }
}

Examples of correct code for this rule:

class Foo extends React.Component {
  constructor(props) {
    super(props)
    this.state = { bar: 0 }
  }
  render() {
    return <div>Foo</div>
  }
}

`never` mode

Will enforce the state initialization style to be with a class property.

Examples of incorrect code for this rule:

class Foo extends React.Component {
  constructor(props) {
    super(props)
    this.state = { bar: 0 }
  }
  render() {
    return <div>Foo</div>
  }
}

Examples of correct code for this rule:

class Foo extends React.Component {
  state = { bar: 0 }
  render() {
    return <div>Foo</div>
  }
}

When Not To Use It

When the way a component state is being initialized doesn't matter.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier! Saves Data!