no-access-state-in-setstate bug? #1597
Description
Hi,
The react/no-access-state-in-setstate rule should prevent usage of this.state inside setState calls. I can see the it generating error with the following code:
Example with errors / trigger
import React from 'react'
class Test extends React.Component {
state = { count: 0 }
handleClick = () => {
this.setState({ count: this.state.count + 1 })
}
render() {
return <p onClick={this.handleClick}>{this.state.count}</p>
}
}
export default Test
but when the state variable is destructured from this.state, there will be no errors/warnings:
Example without errors / trigger
import React from 'react'
class Test extends React.Component {
state = { count: 0 }
handleClick = () => {
const { state } = this
this.setState({ count: state.count + 1 })
}
render() {
const { state } = this
return <p onClick={this.handleClick}>{state.count}</p>
}
}
export default Test
This is especially troublesome when using react/destructuring-assignment with the react/no-access-state-in-setstate.
System & setup
Windows 10, node v.8.9.3, eslint-plugin-react v. 7.5.1, ESLint v.3.19.0 & babel-eslint 8.0.3, using the rule 'react/no-access-state-in-setstate': 2.