react/no-unused-prop-types no working when use `{...this.state}`

Métriques du dépôt

Stars

8 630 stars (8 630 stars)

Métriques de merge PR

Aucune PR mergée en 30 j (Aucune PR mergée en 30 j)

Description

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;

{
  "extends": "react-app",
  "rules": {
    "react/no-unused-prop-types": [
      "error",
      {
        "customValidators": [],
        "skipShapeProps": true
      }
    ]
  }
}

Guide contributeur

Direction de recherche

Enquetez sur la raison pour laquelle la règle 'react/no unused prop types' ne signale pas les props inutilisées lors de l'utilisation de `{...this.state}` en JSX. Examinez l'implémentation de la règle pour détecter l'utilisation des props, en particulier comment elle gère les attributs spread. Vérifiez la logique de parcours AST pour voir si les expressions spread qui référencent state sont ignorées. Envisagez de mettre à jour la règle pour traiter les spreads provenant de state comme une utilisation potentielle des props, ou d'ajouter une option pour ignorer ces cas. Vérifiez les tests existants pour des modèles de spread similaires et ajoutez un test échouant pour ce cas.

Stack technique

javascriptreact

Domaine

frontendtooling

Type d'issue

Bug

DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.

2

Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.

1-3 heures

Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.

Active

ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.

Claire

Prérequis

JavaScriptReactESLint

Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.

75