3

我有一个更新本地状态的组件

class MyComponent extends Component {
    state = {
        number: 0
    }

    refreshState() {
        this.setState({number: this.state.number++})
    }


   render() {
       const key = '2018-12-13T10:00:00.000Z'
       return (
  <div>
        <CountDown
          until={getDurationLeft(key)}
          size={20}
          timeToShow={['H', 'M', 'S']}
        />
      <button onPress={() => this.refreshState()} />
   <div>
   )
}

getDurationLeft = key => {
    const date = new Date()
    return new Date(key).getTime() - date.getTime()) / 1000
}

倒计时组件显示键和当前日期之间的剩余时间

但是每次我按下按钮时，都会重新计算函数“getDurationLeft”

当我快速按下按钮时，时间刷新显示相同的秒数

见 gif http://recordit.co/mHz7AHCNuT

在这段视频中，我非常快地按下按钮

如何避免在刷新状态时重新计算 getDurationLeft

谢谢

4

1 回答 1

0

我解决它添加这个

shouldComponentUpdate() {
    return getDurationLeft(key) > 0
  }
于 2018-12-18T10:42:27.963 回答