使用 ESLint (Typescript) 禁止 MouseEvent

Question

我正在尝试执行一条规则来禁止这样的事情：

const submit = (event: React.MouseEvent) => {};

而是这样做：

const submit: React.MouseEventHandler = (event) => {};

我试过这样的东西：

"no-restricted-imports": ["error", {
  "paths": [{
    "name": "react",
    "importNames": ["MouseEvent"],
    "message": "Please use MouseEventHandler."
  }]
}]

但只有我这样做才有效：

import { MouseEvent } from 'react';

如果人们这样使用它：React.MousEvent ESLint 不会出错。有什么想法吗？

Answer 1

您可以使用名为 typescript-eslint/ban-types

的 ESLint 规则

您可以将其添加到您的 .eslintrc.js 文件中

"@typescript-eslint/ban-types": ["error",
    {
        "types": {
            "React.MouseEvent": { "message": "Please avoid using React.MouseEvent" }
        },
        "extendDefaults": true
    }
],

使用 ESLint (Typescript) 禁止 MouseEvent

Disallow MouseEvent with ESLint (Typescript)

reactjs

typescript

mouseevent

eslint