Stack Overflow
Stack Overflow

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
1
vote
2 answers

useReducer dispatch being called twice

I have a to do's list that has a
  • with an edit Button and Toggle Button. Actually i've made a reducer to do the actions: add, delete, toggle. It's almost working fine, but it is executing the actions twice. The toggle function for example is…
    • Breno Santin
    • 23
    • 4
    1
    vote
    0 answers

    How to set and get data from an odontogram in react js?

    I am trying to get and set data from an odontogram(this one to be exact https://codesandbox.io/s/myy7z75z9j ), the odontogram works but i can't get the data and set it... I was trying to use an "state" to storage but the problem was that the state…
    Marcos Selin
    • 61
    • 4
    1
    vote
    1 answer

    React - useReducer with asynchronous CRUD operations

    I am trying to figure out how to use useReducer with asynchronous CRUD operations (using the fetch API). In my mind the reducer function would look like this: async function reducer(action, state) { const newState = {...state}; switch…
    Laurent Dhont
    • 1,012
    • 1
    • 9
    • 22
    1
    vote
    1 answer

    React show filtered state on click with useReducer

    I'm building a Todo App with React and almost everything worked fine. The todo-items have a "completed" property and based on the property I want to filter todos. ( When you click on an item the "completed" property changes from false to true…
    Ayhan
    • 51
    • 5
    1
    vote
    3 answers

    How to handle the dependent array in useEffect

    I am new to react and just learned how to use useEffect and useState/useReducer. Now I am facing a problem. Assume I have a useEffect like below and states A,B,C,D: React.useEffect(() => { D = fetchReq(A, B, C); }, [A, B, C]) React.useEffect(()…
    jackie_G
    • 13
    • 2
    1
    vote
    0 answers

    Can React dispatch function be wrapped inside of another function that gets returned instead?

    So, when using Context API and useReducer hook, initial state and dispatch function are defined, a Context is created and then a value is returned. return ( {props.children} ); Then at…
    Ante
    • 101
    • 10
    1
    vote
    1 answer

    A way to use useReducer function on other buttons

    I'm new in React.js. I would like to pass the same behaviour again but on the other two buttons like i did in the first. I started with the following function to pass on my useReducer: const hoverReducer = (state, action) => { let newState; switch…
    Leonard
    • 79
    • 6
    1
    vote
    2 answers

    useReducer state is apparently not reactive

    I have had an idea to build a React store that is somewhat like Vuex. I want a wrapper component to receive an object of values and provide, using useContext, an object back that attaches a state and set to each key in the object. For example, if…
    tinkoh
    • 366
    • 4
    • 10
    1
    vote
    1 answer

    Typing the state of useReducer

    I'm currently working on a Calculator on react with typescript but i'm having some issues to type the state in my reducer function. Only "any" works for now. I know that's an object with strings inside, but I don't know why it doesn't works. Thanks…
    Sam
    • 13
    • 2
    1
    vote
    1 answer

    update state in useReducer()

    first of all I have to mention that i'm a bit new to react but I've spent couple of hours on a problem with useReducer and couldn't understand it . here is my code: const defaultCartState = { items: [], totalAmount: 0, }; //action = {type:"ADD" ,…
    amir_70
    • 737
    • 1
    • 10
    • 27
    1
    vote
    0 answers

    use ref() is displaying updated value instead of previous value in react.js

    I am trying to make an app on forex trade that renders updated value..When the value changes i want to display colour that shows the value has been changed..if the previous value is less than the updated value it should show red,green for greater…
    unknown
    • 11
    • 2
    1
    vote
    0 answers

    Performance concerns with useContext and useReducer in React

    Is there a way around re-rendering consuming components using useContexts with hooks? I am new to React and was looking into using useReducer for better state transitions.
    Char
    • 21
    • 1
    1
    vote
    1 answer

    Getting this TypeError: state is not iterable while using useReducer()

    I am trying to create E-comm website with header contain cart ,login button, add wishlist button and also in body having filter out the cloths, electronics and footware section and also creeated card with product name and description price and all…
    Gajanan Shinde
    • 183
    • 1
    • 4
    • 15
    1
    vote
    2 answers

    React render [object Object] when using useReducer instead of JSX

    So I was learning my React course today on Udemy and came across an error where the react app renders [object Object] instead of the JSX (which is supposed to be an empty input box), also, since the input box has onChange method, The input value is…
    Davis Johnson
    • 99
    • 7
    1
    vote
    0 answers

    useContext testing with react-testing-library

    I want to write unite tests to my context&reducer hooks according to another question on stackoverflow i tried following code like this. Here is Modal.test.js : import React from "react"; import { render, fireEvent, screen, getByText } from…
    Deniz Firat
    • 159
    • 1
    • 1
    • 10
    1 2 3
    …
    32 33