Stack Overflow
Stack Overflow

Questions tagged [redux-thunk]

Thunk middleware for Redux. Redux Thunk middleware allows you to write action creators that return a function instead of an action. The thunk can be used to delay the dispatch of an action, or to dispatch only if a certain condition is met. The inner function receives the store methods dispatch and getState() as parameters.

Redux Thunk middleware allows you to write action creators that return a function instead of an action. The thunk can be used to delay the dispatch of an action, or to dispatch only if a certain condition is met. The inner function receives the store methods dispatch and getState() as parameters.

Related tags

2622 questions
19
votes
2 answers

How do I resolve "Actions must be plain objects. Use custom middleware for async actions.]"?

So I have wasted 5 hours on this. I have a redux thunk action like this: export const fetchUser = () => async (getState, dispatch) => { if (getIsFetching(getState().user)) { return Promise.resolve(); } …
mfru
  • 473
  • 1
  • 3
  • 13
19
votes
4 answers

React-Router v4 onEnter replacement

I'm currently trying to build a simple react-redux app that has student and campus data in the backend. OnEnter used to work here, but it doesn't exist in the new react-router. This app tries to load initial data at the start instead of doing a…
fourestfire
  • 197
  • 1
  • 2
  • 8
19
votes
6 answers

How to dispatch an Action or a ThunkAction (in TypeScript, with redux-thunk)?

Say I have code like so: import { Action, Dispatch } from 'redux'; import { ThunkAction } from 'redux-thunk'; interface StateTree { field: string; } function myFunc(action: Action | ThunkAction, dispatch:…
pleasedesktop
  • 1,395
  • 3
  • 14
  • 25
18
votes
1 answer

RTK Query get state from another slice using getState()

I just started on redux yesterday and after reading up on the different libraries, I decided to use the slice route from RTK. For my async, instead of using createAsyncThunk, I decided to use RTK query and I have a question on the right way to…
LuxuryWaffles
  • 1,518
  • 4
  • 27
  • 50
18
votes
2 answers

react redux useSelector rerender even when data does not change

I am using react with redux and redux thunk. I have an action where I am making a network request. With the useSelector I am getting the data from redux store. I have a problem that the component rerenders every time when I dispatch the action. I…
otto
  • 1,815
  • 7
  • 37
  • 63
18
votes
2 answers

What is the meaning of lazy evaluation in this comment?

in the Boilerplate I am using for a React Redux project I came across this comment in the code: This is a thunk, meaning it is a function that immediately returns a function for lazy evaluation. It is incredibly useful for creating async…
Michael Jones
  • 2,222
  • 18
  • 32
18
votes
3 answers

Cancelling previous async action using redux-thunk

I am building a React/Redux app using the redux-thunk middleware to create and handle Ajax requests. I have a particular thunk that is fired pretty often, and I would like to cancel any previously started Ajax requests before firing a new one. Is…
Steven Musumeche
  • 2,886
  • 5
  • 33
  • 55
17
votes
3 answers

Getting dispatch function return value

I'm new to react. I tried to separate component and action function. but I cannot get return value from separate action function. Is it possible to return a value (e.g Object {}) from dispatch function I put the brief code as below :…
Angger
  • 755
  • 6
  • 14
  • 31
17
votes
6 answers

React + Redux, How to render not after each dispatch, but after several?

I am trying to make multiple changes to the store, but not render till all changes are done. I wanted to do this with redux-thunk. Here is my action creator: function addProp(name, value) { return { type:'ADD_PROP', name, value } } function…
Noitidart
  • 35,443
  • 37
  • 154
  • 323
16
votes
3 answers

How do I resolve 'Property 'type' is missing in type 'AsyncThunkAction' using Redux Toolkit (with TypeScript)?

I'm using Redux Toolkit with the thunk/slice below. Rather than set the errors in state, I figure I could just handle them locally by waiting for the thunk promise to resolve, using the example provided here. I guess I could avoid doing this, and…
Chance
  • 11,043
  • 8
  • 61
  • 84
16
votes
2 answers

type-safe useDispatch with redux-thunk

I'm using redux-thunk to use async action creators. The result is also returned to the respective caller. function fetchUserName(userId: number): Promise { return Promise.resolve(`User ${userId}`) } function requestUserName(userId:…
K. D.
  • 4,041
  • 9
  • 48
  • 72
16
votes
7 answers

What is a difference between action,reducer and store in redux?

I am new to react/redux. I am trying to figure out how all the pieces in redux interact. The one thing giving me trouble is understanding the relation between actions and reducers,store.
Dishant Chanchad
  • 710
  • 3
  • 9
  • 27
16
votes
2 answers

Testing custom redux middleware

How do I unit test custom redux middleware? I have this simple function that is supposed to dispatch action after a given timeout but ... I have no idea how to approach it. I dint find enough resources regarding this issue. const…
Michal
  • 4,952
  • 8
  • 30
  • 63
15
votes
2 answers

Using Jest mocks results in "Actions must be plain objects. Use custom middleware for async actions."

I have several Redux-Thunk-style functions that dispatch other actions in one file. One of these actions dispatches the other as part of its logic. It looks similar to this: export const functionToMock = () => async (dispatch) => { await…
Kevin
  • 14,655
  • 24
  • 74
  • 124
15
votes
3 answers

Redux-thunk dispatch not working

I am looking at thunk and trying to figure out how to implement an api call. It is not working so I have gone back to the very basics. When I click on the button it shows 'Getting here! in the console, but nothing is showing when I…
user6002037
1 2
3
…
99 100