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
13
votes
4 answers

useState and changes in the props

I'm trying to understand what happens when you have both props and useState in one component. I wrote little example of it which has one parent component that prints its numbers with another child component - const MyNumbers = (props) => { const…
URL87
  • 10,667
  • 35
  • 107
  • 174
12
votes
4 answers

MUI Custom Text Field loses focus on state change

I'm using MUI library to create my React Js app. Here I'm using the controlled Text Field component to create a simple search UI. But there is something strange. The Text Field component loses focus after its value is changed. This is my first time…
Jabal Logian
  • 1,666
  • 4
  • 24
  • 46
11
votes
2 answers

Type for the setState function of the useState hook?

I'm converting my React project to Typescript. I have this piece of state: AdminBlogPostContainer.tsx const [blogPost,setBlogPost] = useState(null); return(
cbdeveloper
  • 27,898
  • 37
  • 155
  • 336
11
votes
1 answer

Persistence with localStorage with useState and useContext React Hooks

I have set up a Provider to share some state for a user using useContext. As such I am trying to leverage local storage to save some state for a users images (avatars, etc.) To start I'm tryingto persist the avatar for a user, essentially saving…
Antonio Pavicevac-Ortiz
  • 7,239
  • 17
  • 68
  • 141
10
votes
3 answers

await useState in React

I've been fighting with this code for days now and I'm still not getting it right. The problem: I'm working with a form that has a dropzone. On submit handler, I need to save the images' url in an array, but it's always returning as an empty…
pop
  • 217
  • 1
  • 3
  • 11
9
votes
3 answers

React js using useState Hook

I'm trying to use useState react hook as follows, const [showMore, setShowMore] = useState(false); function handleClick(){ setShowMore(true); } I pass my wishlistItemCount value to WishlistItems component const wishListItemCount =…
Sahan Thilakarathna
  • 399
  • 4
  • 19
9
votes
3 answers

useEffect not getting trigger after state change

I'm making a custom dropdown, that allows for pushing new items in the dropdown. For some reason the useEffect is not being triggered on state change, but it being triggered on initial render. I'm pretty sure I'm missing something small, but can't…
benishky
  • 901
  • 1
  • 11
  • 23
9
votes
2 answers

Using too many useState hooks in react. How do I refactor this?

the useState hooks are great. I mainly use the useState hooks to initialise certain states, and I also pass the function to children components to change the states. However, I realise I am starting to use too many useState hooks in my parent page…
Daryll
  • 503
  • 1
  • 9
  • 15
8
votes
6 answers

Better way to use useState hook for setting the boolean state in React

I've just started learning React and got to know about the useState hook. I came across two different ways for setting the state for boolean data. So are these two approaches identical and if not, which one is one should prefer? const [isChanged,…
Swanand
  • 97
  • 1
  • 15
8
votes
1 answer

useState hook can only set one object at the time and return the other object of the same array to initial state

I have data in this form: books = [{ id: 1, name: "book-1", audiences: [ { audienceId: 1, name: "Cat A", critics: [ { id: 5, name: "Jack" }, { id: 45, name: "Mike" }, { id: 32,…
Ndx
  • 517
  • 2
  • 12
  • 29
7
votes
2 answers

Would a component re-render if state inside of custom hook changes?

In my React app, I have a custom defined hook that holds a useState value internally, but the custom hook itself does not return any values. If the value of its internal useState changes would this cause the component that calls this custom hook to…
Bear Bile Farming is Torture
  • 4,317
  • 4
  • 27
  • 61
7
votes
8 answers

useState() undefined in React just after set

I have a problem and I do not undersatnd why the hook return undefined : import React, { useEffect, useState } from 'react'; function App(){ const [globalVariable, setGlobalVariable] = useState(); useEffect(()=>{ const test = 5 …
Adrien Aubourg
  • 71
  • 1
  • 1
  • 2
7
votes
3 answers

Is it possible to use dynamic object keys in useState in Reactjs?

I'm trying to get the data from a form in which some fields are dynamic so that their names follow a pattern like the days of the week ending in 1 or 2. In the onChange I send the name of the component that I am editing so the program knows what…
vosejillarsc
  • 75
  • 1
  • 1
  • 5
7
votes
2 answers

FlatList scrollToIndex out of range

I have a FlatList where I'm trying to scroll through each index of my data array every X amount of seconds. There's only two items in my array right now but there could be more. The current code works for the first two iterations but then it does…
oxxi
  • 452
  • 3
  • 11
  • 28
7
votes
2 answers

React Hooks API call - does it have to be inside useEffect?

I'm learning React (with hooks) and wanted to ask if every single API call we make has to be inside the useEffect hook? In my test app I have a working pattern that goes like this: I set the state, then after a button click I run a function that…
jjcreator
  • 73
  • 1
  • 5
1
2
3
…
99 100