score:5
I can initially think of a few different ways you could consider going about this depending on how much effort you feel like putting into it, how true to the vanilla implementation you'd like, and how accurate of typings you want.
The easiest implementation and truest to the API (but with poor typings):
// create your own dispatch function reference with custom typings export const dispatchStore = store.dispatch as typeof store.dispatch | Dispatch<any> // use custom typed dispatch (unfortunately, you can pass it almost `any`thing) dispatchStore(myThunk('id123'))
An easy implementation but requires typing each call (and still has poor typings):
// optional export const dispatchStore = store.dispatch // type each dispatch as any (not good if you need to use 'abort', etc) dispatchStore(myThunk('id123') as any)
This bullet is specific to Redux Toolkit but could easily apply to most TypeScript typing issues with third-party libraries (e.g. Redux). In the case of using
redux-toolkit
, one could create a reference to eitherconfigureStore
orcreateSlice
and manipulate the typings as you choose. In the following code, I wrapped the createSlice function increateSlicePlus
, added a bunch of convenience logic behind the scenes, and enhanced the args and return types.// convenience `request` wrapper around store `dispatch` that abstracts the rest const promise = counter.request.decrementThunk(500) // even the RTK thunk promise is typed appropriately promise.abort()
The code for 3rd example can be found here on Github.
Source: stackoverflow.com
Related Query
- React Typescript - Argument of type is not assignable to parameter of type
- Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element'. Type 'null' is not assignable to type 'Element'.ts(2345)
- Argument of type 'unknown' is not assignable to parameter of type '{}'
- Argument of type 'Element' is not assignable to parameter of type 'ReactElement<any>
- react usestate hooks error: argument of type 'yyy' is not assignable to parameter of type 'setstateaction<xx>'
- getting error : Argument of type '() => () => boolean' is not assignable to parameter of type 'EffectCallback'
- Typescript React/Redux : Argument of type 'typeof MyClass' is not assignable to parameter of type 'ComponentType<...'
- React with Typescript: Argument of type 'never[]' is not assignable to parameter of type 'StateProperties | (() => StateProperties)'
- Argument of type '"MY_EVENTS_LOAD"' is not assignable to parameter of type 'TakeableChannel<unknown>' in yeild takeLatest
- React TypeScript: Argument is not assignable to parameter of type 'never'
- Argument of type 'string' is not assignable to parameter of type '`${string}` | `${string}.${string}` | `${string}.${number}`'
- Argument of type '(dispatch: Dispatch) => void' is not assignable to parameter of type 'AnyAction'
- Argument of type partial is not assignable to parameter of type
- Argument of type 'Date | null' is not assignable to parameter of type 'SetStateAction<Date>'
- React Typescript: Argument of type '{ [x: number]: any; }' is not assignable to parameter of type
- Argument of type 'number' is not assignable to parameter of type 'never' in array.includes()
- Argument of type 'string | null' is not assignable to parameter of type 'ValueFn<SVGPathElement, Datum[], string | number | boolean | null>'
- Argument of type '() => () => Promise<void>' is not assignable to parameter of type 'EffectCallback'
- Getting an error Argument of type 'unknown' is not assignable to parameter of type 'Error | null'
- Redux Toolkit - Argument of type 'AsyncThunkAction<>' is not assignable to parameter of type 'AnyAction'
- React js Typescript Argument of type 'string' is not assignable to parameter of type 'SetStateAction<number>'
- Argument of type 'Element[]' is not assignable to parameter of type 'Element'
- Problem with dispatch "Argument of type '(dispatch: Dispatch<T>) => Promise<void>' is not assignable to parameter of type 'T'."
- Redux - createStore. Argument of type is not assignable to parameter of type 'DeepPartial<any>'
- Argument of type 'AsyncThunkAction<any, void, {}>' is not assignable to parameter of type 'AnyAction'
- TS2345: Argument of type 'ReactNode' is not assignable to parameter of type 'ReactElement'
- Argument of type 'string | undefined' is not assignable to parameter of type 'string'. Type 'undefined' is not assignable to type 'string'
- Argument of type 'typeof test' is not assignable to parameter of type 'Component<{ children?: ReactNode; } & DispatchProp<any>>'
- React onclick Argument of type 'EventTarget' is not assignable to parameter of type 'Node'
- TypeScript w/ React - Argument of type 'string' is not assignable to parameter of type 'keyof T'
More Query from same tag
- how can I change my call condition into a switch case
- useState hook - state gets lost i.e. resets to initial value
- Performance issue with very fast setState calls in React?
- Re-render only part of the component
- How can I show the total number of elements in ReCharts?
- Next JS not properly loading Material UI styles until refresh
- Increment and decrement button function in next.js typescript
- how to map an array of images and use it as inline style in React
- React 18 - destroy is not a function
- How to link an id from an object in an array to a button onClick?
- react diffing with anonymous component in tree
- change value if the checkbox is checked reactjs
- Cors issue i also set the proxy in pkg.json due to cors and set the api according to it but this error is not remove
- Double rendering for ReactJs component with Routes
- Semantic UI React : How to move Button from Left to Right
- React Component with SubComponent - hot reload does not work
- Why ``module build failed`` error when trying to use fontawesom icons in my react project?
- Cannot get table header text while clicking on table cell
- How to Use Emscripten JavaScript File in React
- React hooks - Dispatching a reset state from parent component
- Property value of parent component resets when toggling back and forth between nested routes
- How Prototypal inheritance works in reverse order
- How do I prevent double confirmation in chrome with 'onbeforeunload' events in react
- React JS, Why my page tile is not changing?
- Alter React parent component state
- Basic Gatsby Shopify example missing Layouts
- React: Can't export const
- Make a date-like html input field in React (auto separate numbers with dots)
- State awaiting in React - I'm having trouble understanding the error while using 'useCallback()'
- Infinite recursion using React Hooks