javascript - 读取文件时行间延迟 [错误]

Question

我有以下代码逐行读取文件的内容。

 document.getElementById('file').onchange = function() {
 var file = this.files[0];
 var reader = new FileReader();
 reader.onload = function(progressEvent) {
   var fileContentArray = this.result.split(/\r\n|\n/);
   for (var line = 0; line < fileContentArray.length - 1; line++) {
     console.log(line + " --> " + fileContentArray[line]);
    }
  };
  reader.readAsText(file);
};

我知道在 JS 中延迟的代码是

setTimeout(function() { 
}, 1000)

我想逐行显示，但行与行之间有 1 秒的延迟

但我已经将它放在 for 循环之前，但它不起作用。

Answer 1

您可以使用 setInterval在一个时间间隔内执行您的函数。

也不要忘记 clearInterval条件满足，否则函数不停

示例代码

document.getElementById('file').onchange = function () {
  var file = this.files[0];
  var reader = new FileReader();
  reader.onload = function (progressEvent) {
    var fileContentArray = this.result.split(/\r\n|\n/);
    let index = 0;
    const interval = setInterval(function() { 
      console.log(index + " --> " + fileContentArray[index]);
      ++index;
      if (index === lines.length) {
        clearInterval(interval);
      }
    }, 1000)
  };
  reader.readAsText(file);
};