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
2
votes
1 answer

How to sum, divide values of multiple inputs using onChange event | ReactJS

i try make my first App in react, everything works, but i try take amoun of bill and number of people and divide te bill for person, and add Tip. I know for somebody probably its 5 min solution but i start working with that yesterday and still can't…
GaryNJ
  • 37
  • 5
2
votes
1 answer

userData.name is not showing the user's name

I am learning MERN and I created a simple website on which you can log in and register. The login and register functionality is working perfectly but my About page has some errors. The about page matter is simple if you are not logged in (based on…
Agrim Singh
  • 499
  • 2
  • 13
2
votes
2 answers

Nextjs - How Do I Store A JWT in The Client's Browser That Can Persist A Browser Restart

I am making an app that involves creating a JWT that the client must "remember" for at least 24 hours. I know that sounds strange but this app I'm building involves something called "Litprotocol" which does decentralized authorization. When a user…
2
votes
2 answers

Populating a state after getting a document from the Firestore

I'm building a CRUD and in the edit step I'm trying to populate the edit fields with data from the specific document. I managed to bring the data from Firestore, but I am not able to put the data in the state, it remains empty. Any idea how I do…
2
votes
3 answers

React useState rerender even if i pass the same reference?

What I know is that useState will not rerender if we pass the same state, and I test it by myself, but it worked only the first time the component rerendered, with an initial state passed to useState. But in the example below, the useState rerenders…
2
votes
1 answer

useState of props undefined in React

I'm trying to give a value of the props note to the TextField but if I use TextInput the result is undefined and if I use the note props, I cannot change the value of the TextField afterward. When I console log both of the value, they render twice…
Yohav Rn
  • 159
  • 1
  • 11
2
votes
2 answers

How to get a value from code mirror in react js?

I am trying to get a value from the code mirror input field but I don't know why I am not getting the value from code mirror input field import CodeMirror from "@uiw/react-codemirror"; import { markdown, markdownLanguage } from…
TulaMaagar
  • 23
  • 3
2
votes
1 answer

Problem referencing redux store, state & context of nested component routes in react router dom v6

There is a Catalogue component that some redux store & react context provider code. Before router v6, they wrapped a nested containing Catalogue child routes like below BEFORE client/src/components/Catalogue/index.js import React, {…
2
votes
1 answer

Clicking twice to see the value - UseState - UseEffect React using Function Component

I'm having a newbie problem, I really read all the documentations about it, and have seen all the stackoverflow about this issue, and I still can't get it right. I need to get a value from a const variable, that I'm seeting without clicking twice, I…
Herbert IN
  • 59
  • 8
2
votes
1 answer

calling useState setter function after async API call

const [inventory, setInventory] = useState(null); const [error, setError] = useState(null); useEffect(() => { const apiCall = async () => { try { const products = await axios.get("/product"); …
2
votes
3 answers

React useEffect takes only last element from object array

Why does React only save the last element in my array? I have two elements, map over them and only the last element is put in the hook each time. React.useEffect(() => { if (bearbeiten) { handleClickUserList(bearbeiten.user); …
Captai-N
  • 1,124
  • 3
  • 15
  • 26
2
votes
2 answers

useEffect fetch request is pulling data twice

What I Want: I'm pulling data from an api, then setting the data to state. I've done this inside a useEffect hook, but when I console.log the data afterwards, it's displaying the data twice, sometimes 4 times. I'm at a loss as to why this is…
user18951127
2
votes
1 answer

Updating state from an array with react useState hook

Currently I'm using a state with key values. I'm updating that state from an array by looping over the array and setting state each loop. All this logic is happening from a function that is called from a onChange event from a text input. The…
graylagx2
  • 120
  • 1
  • 6
2
votes
2 answers

How can i update a specific value of a recoil state object

I have this recoil state object: export const LivePolygon = atom({ key: "LivePolygon", default: { radii: ['', ''], coordinates: ['', ''], tilt: [''] }, }); And on another file i import it like this: import {…
Mike Hemilton
  • 91
  • 1
  • 13
2
votes
1 answer

React - Updating State From a Child Component, Then Doing Something Based on State

New to React hooks and state, trying to figure out why my code isn't working. I have an App.js file and a child component called Menu.js. Essentially, Menu.js contains a menu that I want to show if a variable called isOpen is true, and hide if…