做出反应原生 - 更新用户界面的进度

Question

我正在尝试处理反应原生javascript中的一些数据，同时在UI中显示进度百分比。 天真的实现类似于：

0 index

当然，这不起作用，因为本地批处理所有setstate调用并调用最后一个。

任何人都知道它应该如何运作？

谢谢！

Answer 1

如果要在进度后更新状态，则需要使用回调或Promise。

示例

process(element, index, callback) {
  setTimeOut(() => {
    // some functions
    if(callback && typeof callback === 'function') callback();
  }, (10000* index))
}

readData(){
  let i=0
  let len = elements.length
  for (; i < len; i++){
    this.process(elements[i], i, () => {
      const progress = i/len;
      this.setState({progress});
    });
  }
}