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
0
votes
2 answers
How can I make the documentations example of useReducer which is receiving all 3 values work?
Trying to make it work I tried many ways, I just can't understand how the "init" works, how can I add any value to it so the application can run?
Here is a example of what I'm trying to do:
import { useReducer } from "react";
function…

MestreALMO
- 141
- 4
- 14
0
votes
0 answers
useContext + useReducer don't cause rerender (always provide default state)
In a sample mini app I have index.js which renders (with ReactDOM.render method). And is:
import { useReducer } from 'react';
import AppContext, { defaultAppState } from './store/AppContext';
import AppReducer from…

pesho hristov
- 1,946
- 1
- 25
- 43
0
votes
0 answers
React reducer function save the original value
this is the reducer function 1 ====> this holds the value that can change
export const initStateLineDetails = {
loading: true,
error: "",
submit: true,
update: false,
rowcount: 0,
data: []
};
export const lineDetailsReducer =…

Deepika Rao
- 145
- 1
- 3
- 11
0
votes
2 answers
React custom hook vs useReducer
I have created my own React Hook, but i have the React Hook useEffect has a missing dependency: 'setPlayer'. Either include it or remove the dependency array warning, when i'm using the function from my custom hook.
I tried to extract the function…

Limmy
- 53
- 12
0
votes
1 answer
useReducer - Trying to write own useReducer which will not use dispatch if component is unmounted
could you provide your feedback on the code below:
export function useUnmountSafeReducer>(
reducer: R,
initialState: ReducerState,
initializer?: undefined
): [ReducerState, Dispatch>] {
…

Mykyta
- 230
- 2
- 5
- 16
0
votes
1 answer
I have a useReducer state that's an object holding an array of numbers. When I try to increment one of those numbers in the reducer, it goes up by 2?
Here's my react component and my reducer function:
const testReducer = (state) => {
const newState = {...state}
newState.counts[0] += 1
return newState
}
function App() {
const [countState, dispatchCount] = useReducer(testReducer, {counts:…

Chris TF
- 13
- 2
0
votes
2 answers
Error when creating context + reducer in Typescript
Here I want to create an AuthContext to share user state to other components. Here I am using TypeScript to set the variable type. But I get a lot of errors when trying to solve this problem. And I very confused with this problem.
This my…

Raazescythe
- 117
- 1
- 20
0
votes
2 answers
why i'm a getting NaN
i tried This pattern of including the dispatch functionality in my reducer function but i got this NaN whatever i try to increment or decrement what's the thing that i'm missing basically creating helper method in my reducer function for better api…

Fares_Essayeh
- 105
- 3
- 11
0
votes
1 answer
A react `useReducer` with some dependencies
i'm creating a react component: TxtEditor
Inside the editor, there is a useReducer hook for manipulating the text:
APPEND => to alter the current text.
UPPERCASE => to convert uppercase letter.
But the reducer function is not a pure function. There…

Heyyy Marco
- 633
- 1
- 12
- 22
0
votes
1 answer
Problem with reducer function in useReducer hook
The reducer function works fine except that previously added object element to the item array property gets over written whenever new object element is added.
For example, if state.item contains {number: 1} and I add {number: 2}, it becomes…

Yoshiminea
- 15
- 6
0
votes
1 answer
Not really getting the useReducer hook
I'm trying to change a value from a select menu. My code is working, but I think this would go better if I used useReducer.Am I correct? I tried to change it, but I just can't seem to make it work... At the documentation it says that:
"useReducer…

rafaelpadu
- 1,134
- 2
- 6
- 20
0
votes
1 answer
Usereducer state is alway undefined when used with useContext
I am trying to use useReduce along with useContext, when I console the value in a reducer, I am getting array of an object in the console, but when I try to access the state from another component, I am getting the state is undefined. State.map()…

sujith kharvi
- 13
- 3
0
votes
1 answer
TypeScript React - useReducer with Array of Objects in Interface
I've created the following component:
import React, {useReducer} from 'react'
type ACTION_TYPE = | {type: 'SET_USER', userId: number} | {type: 'DELETE_USER', userId: number, deleteMessages: boolean}
interface User {
id : number;
name? :…

Alk
- 5,215
- 8
- 47
- 116
0
votes
1 answer
How can i set the initialState value from the backend to use in form input value? Input doesn't change after giving value = product.name from Backend
Right now I am using useEffect() to check for the product via the id param. And I can set initialState value to an empty string, but is there any way that we can set the initialState value via the backend or after the useEffect() has been done.
If I…

Nikhil Thadani
- 3
- 2
0
votes
2 answers
React: How to make store invulnerable for reload?
I created store with useReducer, and provide state and dispatch function by Context provider:
/*code...*/
import { InsuranceItemContext } from './Context/InsuranceItemContext';
import { reducer } from './Reducer/Reducer';
function App() {
const…

Iangyl
- 69
- 11