react-hooks-middleware
Install
npm install react-hooks-middleware
Then just import it and use it like you would React.useReducer()
.
; { const state dispatch = ; // ...}
Usage
Create your actions just like you would in Redux. Similar to redux-thunk, if an action returns a function, it's treated as a thunk and has access to the current state.
{ return type: 'increment' ;} { return { const count = ; if count % 2 !== 0 ; };}
Create your functional component and call the useThunkReducer()
hook as if it were React.useReducer()
;
; // ... { } { const state dispatch = ; // ... return <> Count: statecount <button onClick=onButtonPress>+</button> </> ;}
Dispatch your actions using the augmented dispatch
function.
const onButtonPress = { ;};
The value of the inner function will be returned when dispatching thunks.
{ return { ; return count; };} const newCount = ;