JSX/React上的ESLint错误

ESLint errors on JSX/React

本文关键字：ESLint 错误 上的 React JSX      更新时间：2023-09-26

我正在使用React，这是我第一次，我需要知道这些错误是什么，以及如何修复

app/app.js
  21:49   error  'socket' is missing in props validation for App  react/prop-types
  22:47   error  'room' is missing in props validation for App    react/prop-types
  23:47   error  'mode' is missing in props validation for App    react/prop-types
  24:47   error  'user' is missing in props validation for App    react/prop-types
  26:32   error  'socket' is missing in props validation for App  react/prop-types
  26:57   error  'room' is missing in props validation for App    react/prop-types
  26:80   error  'mode' is missing in props validation for App    react/prop-types
  26:103  error  'user' is missing in props validation for App    react/prop-types

这是我得到错误的文件

const query = qs.parse(location.search);
const config = {
  socket : query.socket || 'http://10.28.10.85:1101/chat',
  room   : query.room || 'BJTest',
  mode   : query.mode || 'player',
  user   : query.user || 'Alberto',
};
class App extends React.Component {
  constructor (props) {
    super(props);
  }
  render () {
    return (<div>
      <div><strong>Socket:</strong> {this.props.socket}</div>
      <div><strong>Room:</strong> {this.props.room}</div>
      <div><strong>Mode:</strong> {this.props.mode}</div>
      <div><strong>User:</strong> {this.props.user}</div>
      <hr />
      <Chat socket={this.props.socket} room={this.props.room} mode={this.props.mode} user={this.props.user} />
    </div>);
  }
}

我认为您需要定义App和Chat组件中使用的proptype。请参阅：https://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html#es6-类进行定义。

示例：

App.propTypes = {
  socket: React.PropTypes.string.isRequired,
  room: React.PropTypes.string.isRequired,
  mode: React.PropTypes.string.isRequired,
  user: React.PropTypes.string.isRequired
};
相关文章：