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

React - Trying to store the name in the favorites

I want to save the names of the recipes I create, so I can check if a recipe with the same name is already created. I tried everything but I couldn't figure it out. I want to store the new recipe in favorites so I can't have the same recipe. That's…
DimitriTfb
  • 49
  • 9
0
votes
1 answer

combine useState with the index inside return map

I want to create a stepper in a form that when you click the next button it's controlled by a useState that sets the current step to true or false. I know I could do this without a map function or by repeating myself with a series of map functions…
Rogestav
  • 65
  • 2
  • 8
0
votes
1 answer

React - useEffect is triggering more times than needed

I'm having some issues while rendering a component in my project. The goal of this component is to fetch some data with a 3rd party API and then display it in a HTML table (MatchTable component). Profile.js // import statements export const Profile…
GD1
  • 77
  • 4
  • 12
0
votes
1 answer

React app hanging when typing on input with onChange state

When I start typing anything in the input fields, the page hangs and nothing gets typed. It was working fine before, it just started happening suddenly. I don't know what went wrong. I have tried adding onBlur and the problem persists. I tried…
za_ali33
  • 366
  • 2
  • 9
0
votes
1 answer

Uncaught TypeError: setFieldValue.providerName is not a function - useState

I am trying to use a more concise method of declaring the initial state of my form values by declaring them in an object within useState and having them be updated by user input. However I get the error "Uncaught TypeError:…
0
votes
1 answer

Can't update text area value

I'm trying to learn typescript, currently creating a note taking app. It's very simple: when you click on adding a new note, you a get an empty textarea, where you can edit your note. I'm able to add notes, but I can't update the value of each…
agobago
  • 81
  • 7
0
votes
2 answers

Handle dynamically created text inputs with usestate - ReactJS

I'm making a todo list in react js. Each time a new todo item is created, some buttons are appended next to it along with a edit input text box. I'm trying to avoid using refs but purely usestate for my case, however I can't figure out how to do it.…
Manager09
  • 21
  • 3
0
votes
2 answers

useState replaces the current element

I have 2 buttons. Add1 and Add2 The Add2 button in the Test does not work. What am I doing wrong. I'm not very familiar with React. import React, { useState, useEffect } from "react"; import ReactDOM from "react-dom"; import { observer } from…
0
votes
0 answers

Why can't I use increment operators with useState?

I've recently jumped into studying react and encountered this trouble. Why can't I use increment operators when changing the state? function App() { const [num, setNum] = useState(0); const changeNum = () => { setNum(num + 1) } return…
Seung
  • 1
0
votes
0 answers

How to set state for components iteratively rendered from array mapping?

I have buttons iteratively rendered from their parent. I want to change each button's text individually on click. Code as follows: function App() { const [btnText, setBtnText] = useState('Add to cart'); const handleClick = () => { …
one-hand-octopus
  • 2,229
  • 1
  • 17
  • 51
0
votes
2 answers

useState gets initialized and not updates

I'm implementing infinite scrolling with search bar. So I need to bring 10 items each time I call API, incrementing page number by 1. I used useState to increase pageNumber and called setPageNum before I call 'fetchMore' function in the child…
Ava Kim
  • 47
  • 1
  • 5
0
votes
1 answer

React Native, node js - update object in different scripts

I'm building an app in React Native, and I am trying to understand if I need to use useState & useContext to export a user info object, or I can just get the object from the script, change it, and it will be changed to all the other scripts. (or if…
0
votes
2 answers

I got stuck on iteration, it shows result perfect but when I render on the component level on load it loads on the same field but last object on

I got stuck in rendering component level on load. When I click edit and call edit function, it loads data properly in console and show all objects but it doesn't render on the page level. Here is my code: const handleEdit = async () => { const {…
Raza Ali
  • 11
  • 5
0
votes
1 answer

How to prevent object undefined in React

I have react app requeting a flask server, I can return the objects but when I assing the state to a new variable it log undefined, even though I am able to log it const [characters, setCharacters] = useState([]); useEffect(() => { const…
Yusuf
  • 2,295
  • 7
  • 15
  • 34
0
votes
1 answer

Using a state variable to hide menu options after clicking a submit button

const [selected, setSelected] = useState([]); const [hide, sethide] = useState(); {[ "one", "two", "three", "four", …
Omar Aziz
  • 19
  • 4