如何用ESLint静态检查useState解构变量的命名规范？

• 你可以借助eslint-plugin-react插件里的react/hook-use-state规则来实现这个检查需求。这个规则会强制要求useState解构出的setter函数必须遵循set[状态变量名]的驼峰命名格式——比如状态变量是foo，对应的setter就必须是setFoo。

• 配置方法很简单，在你的ESLint配置文件（比如.eslintrc.js）里启用该规则即可：

module.exports = {
  plugins: ['react'],
  rules: {
    'react/hook-use-state': 'error' // 也可以设为'warn'，根据团队需求选择报错级别
  }
};

• 配置完成后，只要出现不符合规范的setter命名（比如setfoo、updateFoo、fooSetter这类写法），ESLint就会立刻抛出错误或警告，提醒你修改成符合要求的命名格式。

内容的提问来源于stack exchange，提问作者Jonathan.Brink