[Basic] useReducer: type safe dispatcher call

[Taschenbuch]

What cheatsheet is this about? (if applicable)

Basic cheatsheet

What's your issue or idea?

Suggestion for useReducer on this page:
https://react-typescript-cheatsheet.netlify.app/docs/basic/getting-started/hooks/#usereducer

You can make the dispatch() call type safe too by using a const as parameter with type information. That can be helpfull when you have a lot of dispatchers and you need to refactor some later:

instead of this:
onClick={() => dispatch({ type: "decrement", payload: "5" })}

you could do this:
onClick={() => {const action: ACTIONTYPE = { type: "decrement", payload: "5" }; dispatch(action);}}

awesome page. helped me a lot to migrate my react js to typescript.

[filiptammergard]

Hey @Taschenbuch! Not sure how this would improve type safety. You can see in the playground that the dispatch function is already type safe.

Try changing type do something that is not included in ACTIONTYPE or changing payload to something that's not supported by that type—TypeScript will tell you something is wrong.

Great to hear that the cheatsheet has helped you! Feel free to comment if you still think something could be improved.

[Taschenbuch]

my fault. you are right. I did not notice and did not expect it to be type safe out of the box. nice