Questions tagged [use-reducer]

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.

495 questions
2
votes
0 answers

How to toggle password show and hide using useReducer in react

https://codesandbox.io/s/loginusingreducer-fo3bgv?file=/src/App.js Hi, I am having 2 issues in this application. First one is when I am trying to show/hide the password using useReducer. When I chick on the show icon ,I can see the password but…
2
votes
1 answer

useReducer state change is one character delay at onChange

When I try to use useReducer as state management but the problem arises when I use onChange with the reducer it is one character delay. There is a useEffect that depends on the character changes to turn the validity value true or false. But it works…
Gazi
  • 53
  • 4
2
votes
0 answers

How to update a component according to the state?

I need to display a list of objects in my Explorer component. In my app I use useReducer hook what wrapped by Context. It works well when the data flow is in "input-mode" (when I update data in state). But it does not rerender the application after…
2
votes
2 answers

I keep getting " Uncaught TypeError: dispatch is not a function" whenever I try to use dispatch using useContext hook

So I've been learning to use useContext and useReducer hooks with action/dispatch and whenever I try to use dipatch function from any component, it throws out "Uncaught TypeError: dispatch is not a function" error.. it's been 5 days now:/ I try to…
sohan
  • 23
  • 3
2
votes
2 answers

How to properly splitt dispatch and state so that I dont get re-renders?

I had implemented useContext + useReducer and I found that I was getting re-renders when only dispatch changed. I could have two separate components and if one dispatch was triggered both component got changed. Example: Both increment and decrement…
CodingLittle
  • 1,761
  • 2
  • 17
  • 44
2
votes
1 answer

How to persist state using localstorage with NextJS, ContextAPI, and useReducer

I'm creating a job site where you can add specific job cards to a favorites section by using the ContextAPI and useReducer hook for global state management. I followed the code for using contextAPI and useReducer through this video on youtube:…
Chris Wu
  • 43
  • 1
  • 5
2
votes
1 answer

Typescript and Reducer function with multiple payload options

I'm very new to typescript and I'm trying to write a reducer function with three possible payload values : no value, a string, or a number. I'm using discriminated union type and from what I have read I think my code should work, but it is not. type…
AlanJ
  • 49
  • 5
2
votes
1 answer

State becomes undefined after dispatch with UseReducer and UseContext

Goal: I am trying to toggle the visibility of a 3D model using React reducer and context. 3D rendering is done with React hooks version of a framework called Xeokit. Models are rendered into a canvas element (3DCanvas.js) by giving them as props to…
Koib
  • 23
  • 4
2
votes
1 answer

Using useContext to set dark mode for all pages in Next JS and Material UI

I am trying to incorporate a dark mode on all my pages in a Next JS project, using Material UI for styling and useContext with useReducer hooks to set dark state. I placed both context provider and material theme provider in the _app.js above all…
2
votes
1 answer

my reducer functinos calls sometimes once, sometimes twice and i dont understand what is the problem.. :(

my reducer functinos calls sometimes once, sometimes twice and i dont understand what is the problem.. :( My nodejs server sometimes gets 2 requests and sometimes one request but I only tell the app to send one request as soon as a button is…
Elad87
  • 941
  • 1
  • 3
  • 8
2
votes
1 answer

'dispatch' is not defined when using useReducer with useContext in react

I'm trying to figure out how to change global state from a componenet using useContext and useReducer dispatch method. The component is simply should change the backgournd of the page on a click Here is how I defined the context…
MBH
  • 109
  • 1
  • 8
2
votes
1 answer

useReducer init as props

Why is there an error here: Objects are not valid as a React child (found: object with keys {count}). If you meant to render a collection of children, use an array instead. If you do not use prop init there is no error import { useReducer } from…
i like Cola
  • 277
  • 6
  • 15
2
votes
2 answers

Context & Reducer not returning State

Could someone please let me know why the state isn't being updated from the reducer? The useEffect(()=>{}) isn't being triggered when the state is being returned from the reducer. I have validated the correct information is being passed to the…
2
votes
1 answer

how to update nested object with useReducer in React?

How do I update the courseName using this use reducer? error: "cannot create property on courseName on string "science". I am assuming Im not accessing it correctly? I have been using useState but i want to learn useReducer for more complex…
lache
  • 608
  • 2
  • 12
  • 29
2
votes
2 answers

Type 'unknown[]' is missing the following properties from type 'InitialState'

Trying to work out how to pass types to value? {children} Type 'unknown[]' is missing the following properties from type 'InitialState': navigateTo, user, avatar,…
fuzzybear
  • 2,325
  • 3
  • 23
  • 45