Stack Overflow
Stack Overflow

Questions tagged [use-state]

useState related questions for reactjs hooks api.

Basic React Hook

useState

const [state, setState] = useState(initialState);

Returns a state value, and a function to update it.

Resources

useState hook reference

Common Questions/Issues

  • Why isn't React state update immediate?
  • How to access the latest value?

useState set method not reflecting change immediately

3329 questions
4
votes
1 answer

Using onClick function on a styled-components button doesn't change state until the second click (added sandbox URL)

NOTE : I have changed the sandbox link to the working code with some notes to what I had before that wasn't working correctly! I'm still wondering if the code on the bottom is redundant…
Matt
  • 41
  • 2
4
votes
2 answers

How to pass a function to SetState callback after updating? (Reactjs)

I searched a lot before asking but can't seem to find a solution that works with me. I have a function that I need to be called after the state is set to the new value. const onClickCallback = () => { setState(..., setCallback()) } const…
Etch
  • 462
  • 3
  • 12
4
votes
1 answer

How to update State Hook with onClick listener on React Component Instance

I'm attempting to add an onClick to a component instance which changes the state of a useState hook, and prints it out to the console. However, nothing fires when the component instance is clicked. I have tried wrapping it in a JSX div element and…
OJM
  • 442
  • 5
  • 16
4
votes
1 answer

Why does setState Hook from React is rendering twice even not changing the state?

I was studying the React hooks and inserting some console logs in the code to better understand the render flow. Then I started to simulate the setState effects sending the same value to see if React would render it again. import { useState } from…
Nícolas Amarante
  • 165
  • 1
  • 1
  • 7
4
votes
4 answers

React-Router & useContext, infinite Redirect or Rerender

I have a web application that I've been developing for a little over a year and some change. The frontend is react w/ react-router-dom 5.2 to handle navigation, a service worker, to handle caching, installing, and webpush notifications, and then the…
TheFunk
  • 981
  • 11
  • 39
4
votes
1 answer

React useState Props: Type 'string' is not assignable to type 'number'. TS2322

I am trying pass to Props to React useState Hooks. Both my props are required and number but I am getting Typescript error that: Type 'string' is not assignable to type 'number'. TS2322 But I am not passing anywhere the string. So, I don't know…
Krisna
  • 2,854
  • 2
  • 24
  • 66
4
votes
2 answers

useState value not stored after redirection

I'm facing a bit of a problem for the last 2 days and I'm not sure what I do wrong. I want to implement a login page that redirects the user to the dashboard after login. Because I want to use the username across the application I stored the value…
Giorgos Kavalieratos
  • 415
  • 4
  • 13
4
votes
1 answer

Why does a function outside useEffect get called while a function inside useEffect without dependency array doesn't?

Until today I thought that code inside an useEffect without dependency array and code outside useEffect both trigger on every rerender, but then I found this weird case and I don't understand why is this happening. In THIS example, the first time…
BraisC
  • 199
  • 2
  • 10
4
votes
3 answers

How to access state in a React functional component from a setTimeout or setInterval callback?

I am unable to access state in a React functional component from a setInterval or setTimeout callback. A very simple example updating state in one interval and attempting to access state with bound function and unbound arrow interval…
Laurence Fass
  • 1,614
  • 3
  • 21
  • 43
4
votes
3 answers

React hook useState not updating onclick

I am trying to update the sidebar class when the closehandler function is called but the state is not updating. How do I go about that. function RiderSidebar({ sidebar, close }) { const [SidebarClass, setSidebarClass] = useState('sidebar') const…
nnam4x
  • 129
  • 1
  • 1
  • 10
4
votes
2 answers

React keypress event taking only initial state values and not updated values

I am creating a React application in which I have one state called input which is taking input from user. I want that when I press enter key, alert should display the input which is getting set in state. However, on clicking enter key, only default…
satyam
  • 71
  • 1
  • 4
4
votes
1 answer

change the value of useState with setInterval

I have a simple component with useState that increase a counter in each click - function Counter() { let [counter, setCounter] = useState(0); const incCounter = () => { setCounter(counter + 1); }; return (
…
URL87
  • 10,667
  • 35
  • 107
  • 174
4
votes
5 answers

React - issue with useEffect() and axios.get

I am struggling to understand why my code is not working. I am using the useEffect() hook to make a call to an API, and then I am using setState() to update my component state. In my JSX, I am mapping my info array to render the data. Here's my…
Pierre
  • 41
  • 1
  • 2
4
votes
1 answer

React useState update based on a variables previous value

The react.js site has the following code on this page: const [count, setCount] = useState(0); ...
4
votes
1 answer

setting state inside useEffect

I am trying to update the state (tableColumnConfiguration) inside useEffect and then pass on that state to the child component, but this code throws a "Maximum update depth exceeded" error and the app freezes without being able to click anything on…
Glory Raj
  • 17,397
  • 27
  • 100
  • 203
1 2 3
…
99 100