get latest state before dispatch react-navigation & redux

Question

I was just wondering if I call a dispatch and send props using redux and navigate to another component in the same function, How do I ensure that I get the latest props before it render the component?

................

onSubmit() {
  const { navigate } = this.props.navigation;
  this.props.correctAnswer(30);
  
  navigate('Another_Component',{score: this.props.totalScore});
}

return {

render(
  <View>
    <TouchableOpacity onPress={() => this.onSubmit()}>
      <Text>ADD 30</Text>
    </TouchableOpacity>
  </View>
);

}

const mapStateToProps = (state) => {
  return {
    totalScore: state.CurrentActScore
  }
}

const mapDispatchToProps = (dispatch) => {
  return {
    correctAnswer: (data) => {
      dispatch({ type: 'ADD_SCORE', value: data})
    }
  }
}

...........

right now it still send 0, the initial state.

When I add a componentWillReceiveProps(), it still navigate with old value.. I think before it finish process and setState, it's already navigate.

tjcafferkey tjcafferkey · Accepted Answer · 2017-07-19T09:23:16

You need to subscribe() to your store, and then onStoreUpdate() you need to getState and assign that to your components this.state or this.props

Once you've got the latest state you can dispatch/setState with the latest data.

get latest state before dispatch react-navigation & redux

1 Answers