全局引用ref、onMounted等基本方法 eslink会报红

ESLint 是一个流行的 JavaScript 代码风格检查工具，它可以帮助开发者遵守编码规范，提高代码质量。当你遇到全局引用 `ref` 和生命周期钩子函数如 `onMounted` 报红的情况，这通常意味着：

1. **ref**：`ref` 是 React 中的一个特性，用于获取 DOM 元素或者自定义组件实例的引用。如果直接在 ESLint 中使用 `ref` 关键字，它可能会误认为是一个未定义或不受支持的变量，因为 `ref` 是 React 内置的功能，而不是 JavaScript 的标准语法。解决方法是在项目中引入 `@typescript-eslint/eslint-plugin` 或者在配置文件 `.eslintrc.js` 中明确设置 `react-hooks` 插件，允许对 React Hooks 的使用。

2. **onMounted**: 这不是 JavaScript 或者 Vue 等框架的标准命名，而是可能是你在使用特定库（如 Ant Design 或 MobX）中的生命周期钩子。ESLint 可能识别不出这个名称，因此报错。你需要确认你的库是否正确导入，并且在相应的插件中配置正确的规则名称，例如 `vue-class-component` 或者 `mobx-react`.

为了避免这类问题，在配置文件里，你可以添加类似这样的规则：

// .eslintrc.js 或 package.json 配置
"plugins": [
  "react",
  "vue"
],
"rules": {
  "react/jsx-no-bind": "off", // 允许使用 this.setState
  "vue/require-vue-jsx-component-definition": "off" // 允许未定义的生命周期函数
}

然后按照库的具体文档调整规则设置。