React State is a built-in React object that is used to contain data within a component. One of its main purposes is to re-render the component whenever the state changes.
Questions tagged [react-state]
1169 questions
545
votes
23 answers
React - changing an uncontrolled input
I have a simple react component with the form which I believe to have one controlled input:
import React from 'react';
export default class MyForm extends React.Component {
constructor(props) {
super(props);
this.state = {}
…
alexs333
- 12,143
- 11
- 51
- 89
230
votes
14 answers
What is useState() in React?
I am currently learning hooks concept in React and trying to understand below example.
import { useState } from 'react';
function Example() {
// Declare a new state variable, which we'll call "count"
const [count, setCount] = useState(0);
…
Hemadri Dasari
- 32,666
- 37
- 119
- 162
24
votes
5 answers
React Use Context. Cannot destructure property 'currentChatbotInEdit' of 'Object(...)(...)' as it is undefined. How can I fix that?
I try to import the chatbotcontext in order to get access to current chatbot in edit, but something went wrong. Do you have ideas what could be the issue here?
Here is the error message:
Here is an excerpt of my chatstate.js:
// import…
Rainer Winkler
- 485
- 1
- 7
- 20
21
votes
6 answers
How to initialize the react function component state from props
I'm using React hooks for app state, I wondered about how to initialize the function component state using props? The useState hook doc says something definitive like,
const [count, setCount] = useState(0);
I want to initialize that 0 value by the…
Kiran Maniya
- 8,453
- 9
- 58
- 81
14
votes
4 answers
How will React 0.14's Stateless Components offer performance improvements without shouldComponentUpdate?
This question has been going round and round in my head since I read the release notes (and other related hype) around React 0.14 - I'm a big fan of React and I think that stateless components…
Dan Roberts
- 2,244
- 16
- 31
12
votes
1 answer
State using React Typescript: Property does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes
I am new to React with Typescript and I am getting an error stating :
No overload matches this call. Overload 1 of 2, '(props:
Readonly<{}>): IndexPage', gave the following error.
Type '{ notes: { 1: { _id: number; title: string; body: string;
…
Dev.D
- 407
- 2
- 4
- 12
10
votes
3 answers
zustand typescript persist how to type store
I've this simple store
interface CartState {
cart: { [id: string]: CartDto };
addItem: ({ id, image, name, price }: Omit) => void;
removeItem: (id: string) => void;
reset: () => void;
}
export const useCart =…
user3887366
- 2,226
- 4
- 28
- 41
9
votes
1 answer
React testing library - waiting for state update before testing component
I am testing a combobox on first render the initial value of the combobox is undefined. Then using query parameters and a useEffect the the component find the relevant option and sets the value state to it.
const Component = () => {
[value,…
mycodegoesKABOOM
- 187
- 1
- 2
- 9
9
votes
3 answers
How to update (re-render) the child components in React when the parent's state change?
Okay, I already know one way to do this. However, I am asking this in case I am reinventing the wheel since I am very new to React. I was under the impression that if a parent component passes her state to the child components via props than upon…
scribe
- 673
- 2
- 6
- 17
7
votes
1 answer
Lifting a state so I can modify it with an onPress
I am trying to figure out how lifting states work. Currently, I am trying to use onPress in a different component to change the state. In the snack demo I provided below, ListHome and MapHome do not respond for some reason, but you will still see…
Justin Priede
- 444
- 6
- 30
7
votes
4 answers
next/link losing state when navigating to another page
I am developing a library Next.js application. For the purposes of this question, I have two pages in my application: BooksPage which lists all books, and BookPage which renders details of a book. In terms of components, I have a
fredperk
- 737
- 1
- 9
- 22
6
votes
2 answers
React component re-renders after setting state to the same value
import { useState } from "react";
export default function App() {
const [buttonClicked, setButtonClicked] = useState(false);
console.log('Render');
return (
Filip Mamcarczyk
- 161
- 2
- 4
6
votes
2 answers
Why am I getting "Type 'String[] | undefined' is not an array type." for my object variable?
I am trying to create a state variable named hidden to be a dictionary (ex: [{'cutomkey1':'somevalue', 'customkey2':'somevalue'}]). hidden can be empty [{}].
In one of my methods I want to push an item {'asd':'asd'} to the hidden state variable and…
Imnotapotato
- 5,308
- 13
- 80
- 147
6
votes
2 answers
How to Unmount React Functional Component?
I've built several modals as React functional components. They were shown/hidden via an isModalOpen boolean property in the modal's associated Context. This has worked great.
Now, for various reasons, a colleague needs me to refactor this code and…
robertwerner_sf
- 1,091
- 4
- 21
- 35
6
votes
4 answers
React - State Hook map is not a function
I know there are similar questions, but I can't find out why the error happens. Div shows, but then app crashes (as if was some length problem)
Code is similar to examples I found, like this sandbox
What am I doing wrong?
this is component:
import…
nanquim
- 1,786
- 7
- 32
- 50