version: 7.6.1
state = {
removeQueue: [], <--- unused state field: 'removeQueue'
}
onUpdate = (date, id) => {
this.setState(prevState => ({
removeQueue: [...prevState.removeQueue, { date, id }],
}));
}
I'm using removeQueue in functional setState, but eslint shows error.Unused state field: 'removeQueue' (react/no-unused-state)
I also maked onUpdate a constructor-bound instance method as @ljharb said.
constructor() {
super();
this.onUpdate = this.onUpdate.bind(this);
}
onUpdate(date, id) {
this.setState(prevState => ({
removeQueue: [...prevState.removeQueue, { date, id }],
}));
}
But it shows me same result..
We are getting bit by this too. Here's my minimal example to reproduce:
// index.js
import React from 'react';
export default class MyComponent extends React.Component {
constructor() {
this.state = {used: 1, unused: 2};
}
componentDidUpdate() {
this.setState(({unused}) => ({
used: unused * unused,
}));
}
render() {
return <div>{this.state.used}</div>
}
}
// package.json
{
"name": "test",
"eslintConfig": {
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"plugins": ["react"],
"rules": {
"react/no-unused-state": "error"
}
},
"dependencies": {
"eslint": "^4.19.0",
"eslint-plugin-react": "^7.7.0"
}
}
Error: Unused state field: 'unused' (react/no-unused-state)
the same problem +1
Same problem here. Not sure what else I could provide as insight...
What's needed now is a PR.
+1, error happens on destructing like @lemonmade commented.
Most helpful comment
We are getting bit by this too. Here's my minimal example to reproduce:
Error:
Unused state field: 'unused' (react/no-unused-state)