react怎么实现数字增长

Question

react怎么实现数字增长
请大神指点
// state数据
state = {

rightIndexTop: [{
    rightIndexTopAllLeftTop: 10278
},{
    rightIndexTopAllLeftTop: 10278
},{
    rightIndexTopAllLeftTop: 10278
}]
numAll: 0

}

// componentDidMount里面
this.state.rightIndexTop.map(item => {

  let timer = null;
  if(this.state.numAll<item.rightIndexTopAllLeftTop){
    timer = setInterval(() => {
      this.setState({
        numAll: this.state.numAll+549
      })
    }, 0);
  }else{
    console.log(1)
    clearInterval(timer);
  }
})

这样为什么实现不了？
具体代码，谢谢指点

Answer 1

let result = 0;
let timer = setInterval(() => {
  result += 549;
  this.setState({
    numAll: result
  })
  if(result >= 10217) {
    console.log(1)
    clearInterval(timer);
  }
}, 0);

你的代码中：

1. 根本不会执行else中的代码，即不会去执行clearInterval(timer)；
2. setState 是异步的，不能保证执行setInterval里面的代码时，this.state.numAll的值是递增的。

Answer 2

不知道你问的是什么？

react-count-to了解下。

Answer 3

可否具体点？