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

【问题标题】：How can I show the timer current value when the button is clicked in react-native?在 react-native 中单击按钮时如何显示计时器当前值？
【发布时间】：2020-12-01 06:35:29
【问题描述】：

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

在 Native (ios) 部分，我得到了在文本框中输入的值。因此，当我单击按钮时，我的计数器必须启动。我从数据库中获取我的计数器起始值。第一次点击按钮时效果很好。

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

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

这是我的计时器组件；

从'react'导入反应，{组件}；进口 { 安全区域视图，样式表，滚动视图，看法，文本，状态栏，可触摸不透明度，方面， } 来自 'react-native';

进口{ RTCPeerConnection, RTCIce候选人， RTC会话描述， RTC查看，媒体流，媒体流跟踪，媒体设备，注册全局 } 来自'react-native-webrtc'；类计时器扩展组件{

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 = } 这是我的按钮点击功能。我打电话给这个；渲染（）{返回（{this.tmr}）}

【问题讨论】：

标签： ios reactjs react-native native react-native-ios

【解决方案1】：

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

【讨论】：