How to handle default props? about react

[swyxio]

yeah I get mixed messages from the community on this. I like to assign when destructuring, but others like to use defaultProps. want to put in a PR?

Putting this as a comment but willing to propose a PR if @rssfrncs is not taking this.

interface IMyComponentProps {
  firstProp: string;
  secondProp: IPerson[];
}

export class MyComponent extends React.Component<IMyComponentProps, {}> {
  static defaultProps: Partial<IMyComponentProps> = {
    firstProp: "default",
  };
}

[tsiq-swyx]

I dont use defaultProps myself but just wanted to add that the Spectrum community also suggested adding a withDefaultProps type HOC: https://twitter.com/code_punkt/status/1000105182565490688

also, here is a slightly longer approach also using Omit: https://levelup.gitconnected.com/ultimate-react-component-patterns-with-typescript-2-8-82990c516935

Yours seem much simpler!

would love a PR here, this is the top requested info based on feedback from reddit/hn/twitter/spectrum

[rssfrncs]

@Attrash-Islam go ahead with a PR buddy!

@rssfrncs Thanks! I will do it tomorrow after reviewing the whole repository so it match the README with the other section in the same format 😉

[rssfrncs]

Have you checked out this similar repo? It has an interesting approach to default props. Whilst it is focused on Redux React apps there is a lot of overlap.

The way they do it is not that good since you need to update your DefaultProps interface every time you want to include additional prop (see how initialCount: number is duplicated).

My suggestion is using Partial type feature which gives you to extends the defaultProps whenever you want without any additional type extensions