通过ESLint能让开发人员更快的掌握ES6的一些语言特点,主要讲下ESLint的一些常见容易犯的rule
在对之前开发的前端代码进行ESLint检查是,碰到最多的4类问题是:
- eslint:react/destructuring-assignment:
需要使用变量解构方式对变量进行赋值
// ES6之前常规的写法
const child = this.state.child
// ES6写法
const { child } = this.state
修改前
修改后
- eslint:object-shorthand
参考:https://cloud.tencent.com/developer/section/1135798
修改前
修改后,无报错
- eslint:prefer-const:
block中无需改变值(只读)的变量请改为const
参考:https://cloud.tencent.com/developer/section/1135806
// 修改前
{
onClickHandler = e => {
let { child } = this.state;
console.log(child);
}
......
}
// 修改后
{
onClickHandler = e => {
const { child } = this.state;
console.log(child);
}
......
}
- eslint:prefer-template
参考:https://cloud.tencent.com/developer/section/1135813
修改前
修改后
网友评论