For questions regarding the `useReducer` hook in React. `useReducer` is an alternative way to manage complex state by defining a reducer function that creates the next state based on the current state and a dispatched action.
Questions tagged [use-reducer]
495 questions
2
votes
1 answer
Next.js persistent state with React hooks and localStorage
I'm trying to create persistent state with localStorage and React hooks in Next.js SSR app and everything seems to look good but when I reloade page after update my data I'm getting error:
Warning: Text content did not match. Server: "0" Client:…

Klaudiusz
- 41
- 1
- 4
1
vote
1 answer
Is it possible in Next.js to pass data from getStaticProps to contextProvider and set it as default useReducer value?
In my pages/index.js there is getStaticProps function which fetches list of articles (I'm creating a blog website) which is then used as an init value of my useReducer that is located in the same file. I'm using useReducer to do some basic sorting…

granex
- 11
- 3
1
vote
1 answer
"No overload matches this call" error when setting up Context API on React
When setting up the Reducer using Context API, I get a "No Overload Matches this call" error on the initialState parameter of the useReducer function. I thought it was because the return type of the mainContextReducer function was incorrect however…

Minor Vargas
- 105
- 2
- 12
1
vote
1 answer
UseReducer dispatch getting called twice
I have the following piece of code and the usereducer disptach method is getting called twice. I read up on this and removed the strict mode from index. Now the method is called and run properly but the UI is not getting rendered with the updated…

Philomath
- 1,145
- 4
- 18
- 28
1
vote
0 answers
React useReducer is being called twice on each dispatch
I have this code which seems to be executing each dispatch of the useReducer twice for some reason I don't get to resolve. I have tried to solve it by moving userReducer out of the component, but the results were the same. At this point I don't know…

Germán
- 1,007
- 1
- 7
- 20
1
vote
2 answers
React calculator, which uses userReducer hook for operation, not working. Numbers not displaying
I am making a calculator using the useReducer hook in React.
I have made the useReducer hook to carry out all the operations, and the digit /operation buttons, on the calculator keyboard, are replaced by components which call the reducer. I am…

K E
- 31
- 4
1
vote
1 answer
Invalid number of arguments in useReducer
export function React.useReducer<(state: PasswordResetFormState, action: PasswordResetAction) => PasswordResetFormState,PasswordResetFormState>reducer: (state: PasswordResetFormState, action: PasswordResetAction) => PasswordResetFormState, …

Legand
- 21
- 3
1
vote
0 answers
Firebase Authentication using contextAPI and useReducer hook
I'm creating a shopping cart with both auth and cart functionality using firebase , so on the register functionality it throws no error at the console but its not registering as well
Here is my authReducer content together with the initialState…

Joshua Ndeleva
- 11
- 6
1
vote
1 answer
State variables in useState & useReducer are not able to read values in real time
I have built a simple login/signup page in React. I have two states in my component. inputs & errorState. I am not able to use the real time values of errorState object & logically decide whether to invoke axios sendRequest or not. If you can see…

Balaji KR
- 73
- 8
1
vote
0 answers
Redux: how to combine reducer taking asynchronous action with normal reducer
Redux newbie here.
I have an reducer ProductListReducer that takes asynchronous action (its action creator fetch data from API), whose initial state is InitialProductListStates. I have another synchronous reducer CartReducer, whose initial state is…

Darius Huang
- 13
- 1
- 2
1
vote
3 answers
Prevent useEffect from firing twice with useReducer when using StrictMode
I'm using React's Strict mode, and I'm having a useEffect that is causing me some headaches. Part of React's Strict mode is that those things can fire twice, so I'm writing code to protect myself from that.
However I seem to be missing something…

Anemoia
- 7,928
- 7
- 46
- 71
1
vote
1 answer
overloading payload in useReducer hook, TypeScript
Here is my useReducer hook initialized in Function Component. In listReducer function I want to create user ==> I assign to state an array of type User. So, in payload I have to have User[]. But, when I delete ==> only single element of them by _id…

Paul Gutsal
- 107
- 2
- 12
1
vote
1 answer
React contextAPI fetch not updating state
I'm using contextAPI and trying to fetch data and update state using action and reducer, but the state is not getting updated
im using fetch inside useEffect and after fetch i dispatch type GET_EMPLOYEES
AuthContext.js
import AuthReducer from…

aasem shoshari
- 190
- 2
- 14
1
vote
0 answers
×I get :× TypeError: Cannot read properties of null (reading 'useReducer')
I get the "×
TypeError: Cannot read properties of null (reading 'useReducer')" when I use the following code:
import React, { useReducer,useContext, useEffect } from 'react';
const [{ loading, error, order, successPay, loadingPay }, dispatch] =
…

Ira Tillman
- 13
- 4
1
vote
1 answer
useReducer confusion as to why is dispatch needed?
After studied both useState and useReducer, I am confused by useReducer's code, so reducer takes two argument (state, action), is the state same as the initialState, if so why use two different names? Second, useReduer takes two arguments (reducer,…

jimzhou
- 41
- 1
- 1
- 8