React Native setState is not consistant

Question

Here my state is not updated after using setState.log shows default value most of the time. Why is setState not consistent?

export default class Row extends Component {
  constructor(props) {
    super(props);

    // icons to listview (arrow icon)
    this.icons = {
      up: require("../../assets/ic_play_circle_down.png"),
      down: require("../../assets/ic_play_circle_up.png")
    };

    this.state = {
      title: props.title,
      // getting screen size (width and height)
      let: ({ width, height } = Dimensions.get("window")),

      // collapsed check the listview expanded or not if it is true: list view not expanded
      collapsed: true,

      isApproved: false,
      comment: "dummy comment"
    };
  }
  acceptApproval = () => {
    this.setState({ isApproved: true });
    console.log("Approved TICK " + this.state.isApproved);
    this.verifyApprovals();
  };

  regectApproval = () => {
    this.setState({ isApproved: false });
    console.log("Approved" + this.state.isApproved);
    this.verifyApprovals();
  };

here you can learn about `setState`: https://medium.freecodecamp.org/functional-setstate-is-the-future-of-react-374f30401b6b — dvvtms, Jul 16 '18 at 06:13

score 2 · Accepted Answer · edited Feb 18 '19 at 20:23

2

As you know setState is asynchronously, You should invoke your second function as a callback to setState

this.setState({ isApproved: true }, function(){
   this._setApproval(true)
  });

  };
_setApproval(){
console.log("Approved TICK " + this.state.isApproved);
    this.verifyApprovals();
}

  regectApproval = () => {
    this.setState({ isApproved: false } , function() {
    this._setRejection();
});

  };

_setRejection() {
console.log("Approved" + this.state.isApproved);
    this.verifyApprovals();
}

edited Feb 18 '19 at 20:23

brooksrelyt

3,925
5
31
54

answered Jul 16 '18 at 06:04

Kishan Oza

1,707
1
16
38

I solved my issue.I did not know about "setState -> asynchronous" – Rajitha Perera Jul 16 '18 at 06:15
okay..can u please put the code that is working here @HRCJ – Kishan Oza Jul 16 '18 at 06:50
acceptApproval = () => { this.setState( { isApproved: true, collapsed: !this.state.collapsed }, function() { this.verifyApprovals(); } ); }; – Rajitha Perera Jul 16 '18 at 06:55

React Native setState is not consistant

1 Answers1