ESlint常見報錯問題

1、error Unary operator ‘++’ used no-plusplus
ESLint認爲一元操作符，是不安全的，所以禁止使用
確書寫方式（ESLint格式）
for循環的正確姿勢如下

for (i = 0; i < l; i += 1) {
return;
}

2、eslint error ‘data’ is missing in props validation
缺少propTypes定義
修改方法：添加propTypes定義
DemoName代指你的類名，groupInfo是你類中用到的參數對象

DemoName.propTypes = {
  groupInfo: {
    memberInfo: PropTypes.array || [],
    needCount: PropTypes.number || 0
  }
}

3、error Do not use Array index in keys
ESlint 不支持用數組的循環索引做爲keys
解決方法：可以做value裏的id或者將索引key轉換爲字符串類型
例如：

key={index.toString()}

4、error ‘Component’ should be written as a pure function stateless-function
錯誤“組件”應寫爲純函數無狀態函數
解決方法：改成無狀態函數或者添加以下代碼

 constructor(props) {
    super(props)
    this.state = {}
  }

5、error ‘Component’ is not defined
問題：沒有引入Component
解決方法：

import React, { Component } from 'react'

6、error Must use destructuring props assignment react/destructuring-assignment
必須使用銷燬道具分配反應/銷燬分配

7、error Do not nest ternary expressions
錯誤不嵌套三元表達式
例如：

//這是錯誤寫法
   const name =
     status === 1
        ? canLeader
          ? '名稱1'
          : '名稱2'
        : statusDesc

//正確寫法
 let name = '';
    if(status === 1){
      name= canLeader
      ? '名稱1'
      : '名稱2'
    }else{
      name = statusDesc
    }

解決方法：改成if else 普通寫法即可。

8、error JSX props should not use .bind()
JSX不要用.bind()方法

<div onClick={this.onClick.bind(this)}>button</div>
改爲：
<div onClick={this.onClick}>button</div>

onClick(){
	this.props.onClick();
}
改爲：
onClick=()=>{
	this.props.onClick();
}