在react-native中单击按钮时如何显示计时器当前值？

问题描述

我有一个本机项目。我在项目中添加了一个称为计时器的组件。我在网络上的ComponentDidMount中调用计时器。这部分工作正常。

在本机（ios）部分中，我获得了在文本框中输入的值。因此，当我单击按钮时，计数器必须启动。我从数据库中获得计数器的起始值。单击按钮后，它第一次正常运行。

但是，当我多次退出并单击按钮时，由于它没有输入componentdidmount，因此不会从正确的值开始倒数。我在JoinRoom函数中执行操作。 （单击按钮）。每次我单击按钮时，它都会正确计算值。但是在屏幕上书写时，这是错误的。简而言之，我有一个问题，没有计算出值，而是将其显示在屏幕上。

如果您能帮助我，我会很高兴。

这是我的计时器组件；

从'react'导入React，{组件}; 导入{ SafeAreaView， StyleSheet， ScrollView， 视图， 文本， 状态栏， TouchableOpacity， 尺寸 }来自“ react-native”；

导入{ RTCPeerConnection， RTCIce候选， RTCSessionDescription， RTCView， MediaStream， MediaStreamTrack， mediaDevices， registerGlobals }来自“ react-native-webrtc”； class Timer扩展了组件{

constructor(props) {

  super(props);


    this.state = {  
       seconds: this.props.timerxx,};


  
}
componentDidMount() { 
  if(this.state.seconds>0){
    this.interval = setInterval(() => this.tick(),1000);
  }
}
tick() {

  this.setState(state => ({
    seconds: state.seconds - 1,}));

  
  var date = new Date(0);
  date.setSeconds(this.state.seconds); 
  this.timeString = date.toISOString().substr(11,8);


  if(this.state.seconds==0){
    console.log('geldi',this.state.seconds);

    //window.location.reload();
  }
}

componentWillUnmount() {  
  clearInterval(this.interval);
}

render() {
    return (
      <View>
        <Text>
        Kalan Süre :  {this.timeString}
        </Text>
      </View>
      );
}

} 导出默认计时器

joinRoom =（）=> {this.tmr =}这是我的按钮单击功能。我叫这个； render（）{返回（{this.tmr}）}

解决方法

不确定您的问题，但是您是否正在使用状态来处理变化的值？可能是解决方案。