React Native-回调setstate在iOS中无法正常运行

Question

我有一个模式组件（加载程序），几乎在每个屏幕上都使用了它，但是问题是当我setState并在Alert中调用callback setState时，它不能正常工作，

这是我的代码：

LoginProcess(){
this.setState({postLoader:true})
//calling API and handle if the password is wrong, showing alert
  if(response.ok && response.status == 200){
    //navigate to home
  } else {
    this.setState({postLoader:false},()=>Alert.alert("Perhatian", "Password salah!\nSilahkan coba kembali"))
  }
}

<View>
  <PostLoader showModal={this.state.postLoader} nameLoader="Mengirim data"/> //the loader using modal
</View>

正如您在else{}中看到的那样，我已经将callback处理为显示alert，但实际结果很奇怪，

我的postLoader状态仍然为true，并且Alert弹出并关闭，所以除了在recent apps中滑动我的应用并重新打开，我无法做任何事情，< / p>

任何人都有一个想法，如何等待postLoader状态为false然后调用Alert？

Answer 1

可以将状态设置为false，然后显示警告框。当您在setState的回调中显示警报时，状态将被更改，但组件不会重新呈现自身。试试这个，

LoginProcess(){
this.setState({postLoader:true})
//calling API and handle if the password is wrong, showing alert
  if(response.ok && response.status == 200){
    //navigate to home
  } else {
    this.setState({postLoader:false})
    Alert.alert("Perhatian", "Password salah!\nSilahkan coba kembali")
  }
}

<View>
  <PostLoader showModal={this.state.postLoader} nameLoader="Mengirim data"/> //the loader using modal
</View>

Answer 2

您可以使用setTimeout，该方法将在this.setState之后的指定ms（毫秒）之后执行，并根据需要运行。

LoginProcess(){
this.setState({postLoader:true})
//calling API and handle if the password is wrong, showing alert
  if(response.ok && response.status == 200){
    //navigate to home
  } else {
    this.setState({postLoader:false})
    setTimeout(() => {
    Alert.alert("Perhatian", "Password salah!\nSilahkan coba kembali")
    }, 100);
  }
}

<View>
  <PostLoader showModal={this.state.postLoader} nameLoader="Mengirim data"/> //the loader using modal
</View>