什么是 eslint-plugin-class-property
在 React 16.7.0 版本中，新增了 Hooks 特性，这一特性曾经被视为将 React 革命性地改变的一步。不过，Hooks 实际上不是完整的替代品，有些场景 Hooks 也并不适用。那么在这个时候「class component」就成为另一种选择。
在使用「class component」时，我们会发现某些情况下使用类的非静态属性会出现错误的提示信息，这些错误的提示可能来自于 ESLint，因为 ESLint 并不支持非静态属性。因此，就需要使用 eslint-plugin-class-property，它是一个让 ESLint 支持非静态属性的插件。
如何使用 eslint-plugin-class-property
安装
要使用 eslint-plugin-class-property，需要先安装它。可以通过以下命令在项目中安装：
--- - ---------------------------- ----------
配置
在项目中安装 eslint-plugin-class-property 后，需要在 .eslintrc 配置文件中添加如下配置：
-
---------- -------------------
-------- -
-------------------------------------------- -
-
-这样，eslint-plugin-class-property 就成功添加到项目中了。
开始使用
eslint-plugin-class-property 插件主要用于处理类的实例属性。在使用时，需要根据实际业务需求来决定使用哪些规则。举个例子：
----- ------ - ---- - ----- -
在上面这个例子中，类 People 中的 name 属性并不是静态属性，在使用默认配置 ESList 检查时就会报错，此时我们可以通过 eslint-plugin-class-property 插件来解决问题。
-
---------- -------------------
-------- -
-------------------------------------------- -
-
-在配置文件中添加上述配置后，使用类的实例属性时就不会再出现错误提示了。
总结
eslint-plugin-class-property 可以让 ESLint 支持类的非静态属性，让项目中使用更丰富的类特性。在添加 eslint-plugin-class-property 插件时，需要在配置文件中添加相应的配置项，根据实际需求来选择规则。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/68110