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
7
votes
2 answers

React component sometimes renders twice with unchanged state

I am using Redux to subscribe to a store and update a component. This is a simplified example without Redux. It uses a mock-up store to subscribe and dispatch to. Please, follow the steps below the snippet to reproduce the problem. Edit: Please skip…
Tigran
  • 2,800
  • 1
  • 19
  • 19
6
votes
2 answers

useState with useContext in Typescript

Lets say I have a basic setup for checking whether a user is logged in or not: import { createContext } from "react"; const UserContext = createContext(null) export default UserContext In my App.tsx I want to create a useState hook…
jmsapps
  • 388
  • 2
  • 17
6
votes
4 answers

Why is localStorage getting cleared whenever I refresh the page?

Like the title says, the localStorage I set registers the changes made to the todoList array and JSON.stringifys it; however, whenever I refresh the page the array returns to the default [] state. const LOCAL_STORAGE_KEY = "task-list" function…
TheCryptoChad
  • 85
  • 1
  • 1
  • 4
6
votes
3 answers

How to update a single key value pair in an array of objects in react?

I am trying to update a single key value pair in an array of objets using React. Here is the setup An array of objects const array = [ {id:1,name:'Tyler',age:23}, {id:2,name:'Lauren',age:28}, {id:3,name:'Nico',age:14}, ] Given an id and age,…
Tyler Morales
  • 1,440
  • 2
  • 19
  • 56
6
votes
2 answers

Enable-Disable button with ReactJS

I am trying to enable or disable a button based on whether or not there is text in my input but cant seem to achieve it. When I manually set {true OR false} in the disabled property of Button function it works fine but I am really confused on how to…
elisa
  • 229
  • 1
  • 2
  • 8
6
votes
2 answers

Keep scrolling position when concat more items in a list on ReactJS

I have this list of products on a ReactJS store: {productsList.map((product) => ( )} When I add more products in this list, the scroll position goes to the end of the list. The code to add more…
Danilo Cunha
  • 1,048
  • 2
  • 13
  • 22
6
votes
3 answers

How to call useState from another Page?

Bascially whenever I deleted an item in my handleDelete function it would route back to the homePage and I wanted to display a message that says your product succesully deleted for about 5 seconds. In my index.js I first set message to false. and…
Grizzly Bear
  • 318
  • 4
  • 18
6
votes
7 answers

Cannot destructure property of object from context

Re-posting a similar question to my last because of a new issue. I'm trying to use context with hooks to manage authentication in my react app. I'm getting the error TypeError: Cannot destructure property 'isAuthenticated' of 'Object(...)(...)' as…
userNick
  • 503
  • 4
  • 7
  • 25
6
votes
2 answers

updating array useState react hooks (Next.js)

I am trying to update my 'state' array and insert items of type String into it with 'setState' but it doesn't works. I know it's not work with push(). I also tried to update my 'state' array with the spread operator but it also doesn't work. Here my…
sam
  • 95
  • 1
  • 2
  • 10
6
votes
3 answers

Can't set props to state using useState React

I'm new to react. I've read through react documentation. I've no idea why it is not working. So, I come up here. I'm trying to create pagination in react. Below is my table component. const Table = (props) => { const { description, itemCount,…
Htet Phyo Naing
  • 464
  • 7
  • 20
5
votes
4 answers

Unable to render useState, useEffect hooks in custom component package using microbundle & React

Hi I am trying to create a sample library using React 18.2.0 & Microbundle and Although library built successfully, but when it is consumed in the client app I'm getting the below error in console log: Library source code Below is my library…
Madpop
  • 729
  • 4
  • 24
  • 61
5
votes
1 answer

React child component state is lost after parent component re-renders

I am using a React hook for parent/child component. Now I have state in my parent component (companyIcon), which I need to update based on some validation in the child component. I pass validationCallback as a callback function to the child…
copenndthagen
  • 49,230
  • 102
  • 290
  • 442
5
votes
1 answer

Why does React useState hook trigger a re-render before remaining code executed?

I am trying to figure out when the re-render occurs when updating state in React with useState hook. In the code below, clicking the button triggers the handleClick function which contains a setTimeout. The callback inside setTimeout is executed…
user18054452
  • 65
  • 3
5
votes
3 answers

React state not giving correct value on useEffect()

I'm trying to build a factorization algorithm using react. I would like to add results to LocalStorage based on results from factorization. However, LocalStorage sets previous results not current ones. I think this is happening because useEffect…
Gibberish
  • 48
  • 12
5
votes
1 answer

how can i set initial value for usestate from redux state using selector in react native?

when I try to set initial value from redux state, there is nothing on text component but i can see the value on console const Profile = props => { const userName = useSelector(userSelector); const [name, setName] = useState(userName); …
fatmanur afyoncu
  • 53
  • 1
  • 5
1 2
3
…
99 100