React Native this.setState() 仅在再次与组件交互后重新渲染

Question

通常在使用 this.setState() 时，组件会在通过 setState() 更新状态后重新呈现。不幸的是，我遇到了状态更新但组件不会重新呈现的问题，直到再次与组件交互（即再次单击组件）。这是我的代码：

  constructor(props) {
    super(props);
    this.state = {
      value: new Date(),
      time: 0,
      displayTime: null,
      show: false,
    };
    this.showTimePicker = this.showTimePicker.bind(this);
  }

  showTimePicker() {
    console.log(this.state.show);
    this.setState({show: true}, () => console.log(this.state.show));
    //console.log to verify state changes
  }


render() {
 return(
  <View>
  //code that determines if the datetimepicker modal shows up
  {this.state.show && (
     <DateTimePicker
        value={this.state.value}
        mode="time"
        display="spinner"
        onChange={(date, value) => {
           console.log(value, 'value');
           this.setTime(value);
           setShow(this.state.show);
        }}
      />
   )}
   
   //when button is pressed this.state.show changes to true
   <Button title="Change Time" onPress={this.showTimePicker}></Button>
   </View>
);}

所以我想要的是每次按下按钮时显示 DateTimePicker 模式。目前发生的事情是当我按下按钮时没有任何注册（状态仍然改变）直到我再次点击屏幕（然后模态显示）。我怎样才能让按钮使模态立即弹出？

Answer 1

我在 debug mode 中使用该应用程序时遇到了同样的问题，因此可以禁用调试模式，它应该可以正常工作。

这是类似的问题：UI doesn't update until tap on the screen when setState is called inside a realm listener callback

React Native this.setState() 仅在再次与组件交互后重新渲染

React Native this.setState() only re-renders after interacting with the component again

reactjs

react-native

setstate

rerender