reactjs - Typescript React useCallback eslint tvinga typade argument


Jag försöker tvinga korrekt typning på alla useCallbacks i React med TypeScript och ESLint.
Som standard är argumenten som definieras i useCallback av typen any.

// @types/react
function useCallback<T extends (...args: any[]) => any>(callback: T, deps: DependencyList): T;

Vad detta betyder är att både TypeScript och TypeScript-ESLint:s no-explicit-any-regel inte plockar upp detta (eftersom det är definierat som any).

Så om jag skriver följande kod:

const callback = React.useCallback((value) => {
  ...
}, []);

Jag skulle vilja att antingen TypeScript eller ESLint ger mig ett fel eftersom value är vilken som helst här.

Finns det ett eslint-plugin som kan hantera detta åt mig? Eller missar jag något uppenbart här?

Svar #1

Du kan skriva funktionen manuellt, jag känner inte till några automatiseringar som kan hjälpa dig här:

const callback = React.useCallback<(value: string)=>void>((value)=>{
  // value should be typed as string now
}, []);

Svar #2

Hittills har jag inte hittat någon regel som skulle förbjuda användningen av any-typen. För att mildra problemet slutade vi med att göra reglerna kring användningen av any så strikta som möjligt med denna uppsättning regler:

// eslint setinngs rules:
"@typescript-eslint/no-explicit-any": "error",
"@typescript-eslint/no-unsafe-call": "error",
"@typescript-eslint/no-unsafe-member-access": "error",
"@typescript-eslint/no-unsafe-argument": "error",
"@typescript-eslint/no-unsafe-assignment": "error",

Relaterade artiklar