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
1
vote
1 answer
How to set the data from db to the reducer initial state?
I have a functional component that requires receiving parameter (i.e. props.rosterMonth) from the parent component and then retrieving data from the database, finally pass the result to the children component.
My problem is, how to set the initial…
The KNVB
- 3,588
- 3
- 29
- 54
1
vote
1 answer
How to make a asynchronous sever request in a useReduce hook?
I have set up a useReducer hook with useContext to receive a email and password for login purposes, I have created a component to fetch an authentication token from the server. I can' currently work out how to update the reducer with the returned…
lukeet
- 461
- 1
- 4
- 22
1
vote
1 answer
How to update a key indexed array state in useReducer?
My state model is like below
export interface State {
[key: string]: UnitState;
}
So State is holding states of all units with key as unitID. So it should ideally look like this
{ 'ABC': {unitName: 'John', unitOpen: 'true'},
'XYZ': {unitName:…
code4fun
- 31
- 2
- 3
1
vote
1 answer
Value Assignment for State inside a reducer being performed twice
I am using Reacts useReducer hook. I am trying to increment +1 or -1 depending on which button on react is pushed. I am looking to assign the value before I return the value so I can POST the value to a database. When I run the code it increments by…
RocketMan89
- 19
- 4
1
vote
1 answer
handle useReducer if pass from props
I'm trying to make an overridable usage of a useReducer in a Component for specific use cases.
Following my overfly simplified working state of work :
function defaultToggleReducer (state, action) {
console.log('Default toggler used')
return…
HollyPony
- 817
- 9
- 15
1
vote
1 answer
Typing reducer payload as an object type or array of such
I'm using useReducer to maintain state for an array of object types and I have a few action types. The interfaces looks like:
interface MyObject {
id: string;
foo: string;
bar: string;
}
interface Action {
type: 'add' | 'remove' |…
user487869
- 68
- 1
- 6
1
vote
1 answer
paste token in useReducer with useContext in nextjs and get undefined
I have problem using useReducer with useContext in Next.js. I want to use the token that the user have already make with useReducer and useContext, but when I try it is undefined. I don't know what should I do?
This is my code file:
This is my…
1
vote
1 answer
How Do I Use useReducer with useQuery?
import api from "api";
import { Loader } from "components/base";
import { useReducer } from "react";
import { useQuery } from "react-query";
function reducer(state, { type, payload }) {
switch (type) {
case "init":
return…
CodeFinity
- 1,142
- 2
- 19
- 19
1
vote
1 answer
how to stub react-redux useReducer hook - using cypress
could someone please help me understand how to stub useReducer from react-redux? This code looks like it should work, but it just doesnt (stub never intercepts the useReducer function).
import React from 'react';
import { mount } from…
glo
- 687
- 1
- 8
- 20
1
vote
1 answer
React replacing useState with useReducer while also using a custom hook
so I am making a budget tracking app where the user can add their income sources to an incomes list and expenses to an expenses list, and I got it working, but I wanted to see if I could use useReducer instead of using useState so many times. This…
alti21
- 127
- 2
- 11
1
vote
1 answer
Cant render dynamic content to my modal when clicking a picture
So I'm currently building a new portfolio and I want to display my projects with just a picture at first but when you click on that picture a modal pops up with information about that specific project. I'm currently stuck on the dynamic content of…
Matthew
- 253
- 1
- 15
1
vote
1 answer
React UseContext change not re-rendering component
I am trying to make a simple 'Nonogram'/'Picross' game using React to learn UseContext and UseReducer, but am puzzled as to why my top component (App) is not re-rendering when a value it uses changes. Perhaps I am missing something basic, but I've…
CynicalGoldfish
- 55
- 6
1
vote
1 answer
How use correctly useReducer ? (React Hooks)
I'm pretty sure that I don't use correctly useReducer there is an example :
**//My array with some items**
const items = [
{
id: 0,
title: "Cidre Doux",
img:
"img",
type: "doux",
…
Ludovic Argenty
- 73
- 9
1
vote
1 answer
useReducer + Typescript on a async maner
I'm having an issue with useReducer + Typescript + async. I just can't do it! When I call anything from async function it return a Promise which break my code. When I tried to get it other way, the component is doesn't re-render! That is Driving me…
user11037974
1
vote
0 answers
how to properly test if-else condition in a useReducer switch case?
I am learning React and currently reviewing useReducer. I am trying to create a keypad that resets when an incorrect entry is entered. This code works when the 'add-entry' case is [ ...state, action.value ] but when I introduce the if statement, it…
Jonnie Oak
- 21
- 3