简体   繁体   English

JSX / React上的ESLint错误

[英]ESLint errors on JSX/React

I am working with React and this is my first time, I need to know what this errors are and how to fix it 我正在使用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

and here is the file where I am getting the error 这是我收到错误的文件

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>);
  }

}

I think you need to define proptypes that are used in App and Chat components. 我认为你需要定义在AppChat组件中使用的proptypes。 See: https://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html#es6-classes for definition. 有关定义,请参阅: https//facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html#es6-classes

Example: 例:

App.propTypes = {
  socket: React.PropTypes.string.isRequired,
  room: React.PropTypes.string.isRequired,
  mode: React.PropTypes.string.isRequired,
  user: React.PropTypes.string.isRequired
};

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Atom eslint和jsx / react设置 - Atom eslint and jsx/react setup React ESLint配置“意外的文件扩展名JSX” - React ESLint Config “Unexpected file extension JSX” (ESLint) 未找到规则“re​​act/jsx-sort-prop-types”的定义 - (ESLint) Definition for rule 'react/jsx-sort-prop-types' was not found 如何在 React 应用程序中禁用 eslint 类型错误? - How to disable eslint type errors in react app? 带有 React 的 ESLint 给出了 `no-unused-vars` 错误 - ESLint with React gives `no-unused-vars` errors 如何使用React教程修复流星中的eslint错误 - How to fix eslint errors in meteor with react tutorial 为什么 eslint 考虑 JSX 或一些反应 @types undefined,因为将 typescript-eslint/parser 升级到版本 4.0.0 - Why eslint consider JSX or some react @types undefined, since upgrade typescript-eslint/parser to version 4.0.0 传递onClick函数:[ESLINT] JSX道具不应该使用.bind()(react / jsx-no-bind) - Passing down onClick Functions: [ESLINT] JSX props should not use .bind() (react/jsx-no-bind) Eslint react/jsx-one-expression-per-line:允许变量和 JSX 字符串在同一行,但不允许元素 - Eslint react/jsx-one-expression-per-line: allow variables and JSX strings on the same line, but not elements 带有 typescript jsx 的 ESLint 配置 - ESLint configuration with typescript jsx
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM