eslint-config-airbnb-typescript icon indicating copy to clipboard operation
eslint-config-airbnb-typescript copied to clipboard

[Bug] TS default parameters trigger react/require-default-props

Open Lesik opened this issue 3 years ago • 4 comments

TypeScript allows specifying default values for optional parameters like so:

myFunction = (myParam1, myParam2 = "myValue2") => {};

This is the preferred way to specify default props for components, as shown in this TypeScript example with React from the official create-react-app docs from Facebook.

We are using eslint-config-airbnb-typescript exclusively and it complains about react/require-default-props on a component like this:

interface MyProps {
  myParam1: string,
  myParam2?: string,
}

export default function MyComponent({
  myParam1,
  myParam2 = "myValue2",
}: MyProps) {
  return <></>;
}

One workaround that we found on accident is to export the props (export interface MyProps), even if they are not used anywhere, the eslint error goes away. I'm not sure if that's just because eslint stops parsing that line if it's exported (meaning it's just a hack to turn eslint off and basically equivalent to eslint-disable-next-line) or because it really should be exported.

Lesik avatar Mar 01 '21 10:03 Lesik

I just ended up using

'react/require-default-props': 'off',

But I agree that this seems a bit off.

cd-a avatar Mar 26 '22 09:03 cd-a