首页 > 解决方案 > 如何同步使用 FileReader.readAsText()?

问题描述

我正在尝试使用 JavaScript 中的 FileReader.readAsText() 读取 CSV 文件。但我无法同步获得价值。我尝试了多种方法。但没有一个工作。以下是我到目前为止的代码:

第一种方法:

<input
id = "inputfile"
type = "file"
name = "inputfile"
onChange = {uploadFile} >
    const uploadFile = (event: React.ChangeEvent < HTMLInputElement > ) => {
        let resultSyncOutput = '';

        connst files = event?.target.files;

        if (files && files.length > 0) {
            readAsTextCust(files[0]).then(resultStr => {
                resultSyncOutput = resultStr;
            });
        }
      
      // At this line I am not able to get the value of resultSyncOutput with the content of file sychronously
      
      //Do something with the result of reading file.
      someMethod(resultSyncOutput);
    }

async function readAsTextCust(file) {
    let resultStr = await new Promise((resolve) => {
        let fileReader = new FileReader();
        fileReader.onload = (e) => resolve(fileReader.result);
        fileReader.readAsText(file);
    });

    console.log(resultStr);

    return resultStr;
}

这是我尝试的第一种方法,即使用 async/await。我也尝试在没有 aysnc/await 的情况下做到这一点,但仍然无法成功。此操作必须是同步的,这一点至关重要。

注意:我在 Stack Overflow 中检查了很多答案,但没有一个提供解决此问题的方法。所以请不要将此标记为重复。任何地方都没有提供对这个特殊问题的答案

标签: javascriptreactjsfile-uploadfilereadersynchronous

解决方案


推荐阅读