Console.log of function state

Question

I have this function, I want console.log the output to show the state of isOpen, the expected output must be 'true' only.

open = () => {
    this.setState({
        isOpen: true
    })
}

Possible duplicate of [Why calling react setState method doesn't mutate the state immediately?](https://stackoverflow.com/questions/30782948/why-calling-react-setstate-method-doesnt-mutate-the-state-immediately) — Emile Bergeron, Aug 19 '19 at 14:49

score 3 · Accepted Answer · answered Aug 19 '19 at 14:04

3

Since the setState() is async, you need to call a callback, which executes after the state gets updates.

open = () => {
    this.setState({
        isOpen: true
     }, () => console.log(this.state.isOpen))
}

answered Aug 19 '19 at 14:04

Nagesh

score 0 · Answer 2 · answered Aug 19 '19 at 14:04

0

this.setState will take a callback function.

open = () => {
this.setState({
    isOpen: true
 }, () => {
   console.log(this.state.isOpen ? this.state.isOpen : '')
 }
}

answered Aug 19 '19 at 14:04

GRS

score 0 · Answer 3 · answered Aug 19 '19 at 14:06

0

Since setState() is async, you need to put console.log in callback of setState.

    open = () => {
    this.setState({
        isOpen: true
     }, ()=> {
      console.log(this.state.isOpen);
    }

answered Aug 19 '19 at 14:06

vipulp

3 Answers3