jsx-eslint/eslint-plugin-react
react/no-unused-prop-types no working when use `{...this.state}`
Aberta
#1.601 aberto em 13 de dez. de 2017
bughelp wanted
Métricas do repositório
- Stars
- (9.293 estrelas)
- Métricas de merge de PR
- (Métricas PR pendentes)
Description
HI ALL,
I found a problem with react/no-unused-prop-types rule.
When I use {...this.state} syntax in React component, the rule can't find the unused prop.
I don't know is this a bug with eslint-plugin-react?
Please Help. Thanks.
Component
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import logo from './logo.svg';
import './App.css';
class App extends Component {
static propTypes = {
bar: PropTypes.string.isRequired,
};
state = {
style: { color: 'red' },
};
render() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
// when I add `{...this.state}`, the rule is no working
<h1 className="App-title" {...this.state} >Welcome to React</h1>
</header>
<p className="App-intro">
To get started, edit <code>src/App.js</code> and save to reload.
</p>
</div>
);
}
}
export default App;
.eslintrc
{
"extends": "react-app",
"rules": {
"react/no-unused-prop-types": [
"error",
{
"customValidators": [],
"skipShapeProps": true
}
]
}
}
versions
- eslint: 4.10.0
- eslint-plugin-react: 7.4.0
Reproduce problem repos
https://github.com/zhaozhiming/eslint-plugin-react-no-unused-prop-types