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
0 answers
Does using the combination of useReducer with too many useEffects an anti-pattern?
I have created a Select Dropdown component with its state abstracted in the reducer. I am just updating this collective state using reducer actions and handling the side effects via useEffect but there are too many useEffects now and made me wonder…
Abhinay
- 11
- 4
0
votes
1 answer
Updating a form object with React useReducer
I have a controlled form containing an address object.
const [formData, setFormData] = useReducer(formReducer, {
name: "",
address: { addressLine1: "", city: "", state: "", zip: "" },
phone: "",
contact: "",
});
const…
tdammon
- 610
- 2
- 13
- 39
0
votes
1 answer
What is the best way to keep tracking an updatable data in react native
I stuck on the way to keep the workout data in a session in local storage
The situation is; that there is a bunch of input text taking "weight" and "reps" from the users.
Vahid Afshari
- 49
- 1
- 5
0
votes
1 answer
Can someone explain this line of my implementation of React dispatch with useReducer and TypeScript?
So, to describe it as simple as possible. I have a component App where I'm using the useReducer hook to declare the state and dispatch function, like so:
const [state, dispatch] = useReducer(appReducer, initialState)
In this component through the…
Gass
- 7,536
- 3
- 37
- 41
0
votes
1 answer
Getting a array.map is not a function on a ReactBeautifulDnd dragEnd
I am trying to rearrange menu items in categories using react-beautiful-dnd and useReducer.
I get the categories using the useMenuCategories hook.
This gets me a list of unusedItems and existing categories in the menu.
Something happens on the…
Akshay Kumar
- 875
- 13
- 29
0
votes
1 answer
Type 'IProduct' is not assignable to type '[]'
I have two components parent and child, I want to add dispatch event
Here are my interfaces
export interface IProduct {
id: string;
name: string;
price: string;
image: string;
inStock: number;
…
The Dead Man
- 6,258
- 28
- 111
- 193
0
votes
1 answer
Type 'IProduct' is missing the following properties from type 'IProduct[]': length, pop, push, concat, and 29 more
I have two components parent and child, I want to pass data using props from props by using react and typescript.
Here are my interfaces
export interface IProduct {
id: string;
name: string;
price: string;
image:…
The Dead Man
- 6,258
- 28
- 111
- 193
0
votes
1 answer
how to add type to react useReducer reducer function?
I have this useReducer function in pure react without type script now I would like to add types to it.
useReducer reducer function with pure react without types
export const cartReducer = (state, action) => {
switch (action.type) {
case…
The Dead Man
- 6,258
- 28
- 111
- 193
0
votes
0 answers
How to update nested object values with a reducer function in React?
Hello I have a very complex form with many nested objects and I am wondering how to update a field in the nested objects without writing one million lines of code, this is what I currently have. I have heard about the library called immer but know…
Ryan Speciale
- 95
- 8
0
votes
1 answer
React Context Dictionary not updating immediately issue
I am new to react, I created a context, it has a function that updates the dictionary using reducer dispatcher.
The function takes an object, this object is then converted to another object, and added to the dictionary.
when I try to print the…
ZZZ
- 285
- 2
- 15
0
votes
0 answers
React Context Cannot update a component while rendering a different component
I discovered that my reducer was being called twice for each dispatch after noticing that some of my code's functionality was broken. Now I found out that it is due to the . I would hate to remove this. If I turn on my debugger…
maxfromgermany
- 239
- 4
- 17
0
votes
2 answers
INPUT MANAGEMENT IN REACT FORM
i'm coding a dynamic react form. I want to be able to print a field value, update the state according to it's value changes, and all of that while i'm typing inside that field. I also want to print the state in the console by clicking on the submit…
0
votes
2 answers
React.useReducer() is throwing TS2769: No overload matches this call
Newish to TS. I have a very simple demo app that uses the useReducer() hook to manage the selected state of items in a list. I thought I did a good job of making the reducer type safe but when I call the useReducer() hook I get the TS2769: No…
Neil Girardi
- 4,533
- 1
- 28
- 45
0
votes
0 answers
Dispatching multiple actions, concern about performance - useReducer - React.js
I have this react app, and this component in specific, has a useReducer in order to save a lot of data that it handles.
The problem, is that i'm finding myself creating functions where i dispatch multiple actions, and i'm worried that this could…
Diego
- 421
- 3
- 9
- 34
0
votes
1 answer
The proper way to add types using typescript with useReducer HOOK
I am trying to display a product from faker js using context api and useReducer as follow
CartReducer.
import { IProduct } from "../context/Context";
export interface IState {
products: IProduct;
cart: [];
}
type Actions =
|…
The Dead Man
- 6,258
- 28
- 111
- 193