javascript - 使用本地文件了解 Papaparse

Question

我正在尝试了解如何使用本地文件正确实现 Papaparse。看了很多网上的资源，他们采用的方法是这样的

loadTextFromFile (event) {
    if (!event.target.files[0]) {
        alert('Upload a file.')
    } else {
        let file = event.target.files[0];
        if (file) {
            let reader = new FileReader();
            let config = {
                delimiter: "",
                newline: "",
                quoteChar: '"',
                escapeChar: '"',
                header: true,
                trimHeaders: false
            };

            reader.onload = e => this.$emit('load', Papa.parse(event.target.result, config));
            reader.onload = function (event) {
                let results = Papa.parse(event.target.result, config);
                console.log('PAPA RESULT: ', results.data);
                console.log('ROWS:', event.target.result);
            };
            reader.readAsText(file);

        } else {
            alert('Please select a file to upload.')
        }
    }
}

因此他们使用了 FileReader，它似乎直到 readAsText 结束时才加载文件。然而，上面的示例运行完美，尽管我仍然需要完全理解代码。

然后还有其他例子，似乎没有 FileReader 就可以做到

loadTextFromFile (event) {
    if (!event.target.files[0]) {
        alert('Upload a file.')
    } else {
        let file = event.target.files[0];
        if (file) {
            Papa.parse(file, {
                header: true,
                dynamicTyping: true,
                complete: function(results) {
                    console.log(results.data)
                }
            });

        } else {
            alert('Please select a file to upload.')
        }
    }
}

再一次，这很完美。所以我想了解的是为什么人们有时会使用 FileReader，也许还有关于第一个示例中到底发生了什么的解释。

我应该使用什么选项？

谢谢

Answer 1

看起来第一个示例并没有真正意义——他们将 reader.onload 赋值两次，所以第一个赋值执行 $emit 操作甚至没有被使用。

我会说第一个例子有点草率和不必要。使用您自己的 FileReader 的唯一原因是:

1. 渴望学习如何使用 FileReader API，
2. 出于某种原因需要自定义 FileReader
3. 想要计算加载文件需要多长时间以及 Papa 解析内容需要多长时间

我通常会忽略第一个示例，并坚持使用 Papa 文档中更清晰、更简单的示例。