如何在FileReader.onload（）中使.push工作？

Question

我有以下代码，其中我试图使用FileReader读取文件并将其内容放入数组中。只有在推送完所有数据之后，我才想继续。这是我目前所拥有的：

    const confirm = () => {

        var reader = new FileReader();
        let images = [];
        reader.onload = function(e) {
            images.push(e.target.result);
        };
        reader.readAsDataURL(formValues.images[0].file);
        console.log('images base 64');
        console.log(images); // this prints the empty array. 

    };

我仅在使用文件内容更新图像后才继续。我该怎么办？

-编辑-

实际上我想将多个文件添加到数组，因此我尝试了以下操作。

    var reader = new FileReader();
        let images = [];
        reader.onload = function(e) {
            images.push(e.target.result);
            console.log('images base 64');
            console.log(images);
        };
        for (let i = 0; i < formValues.images.length; i++) {
            reader.readAsDataURL(formValues.images[i].file);
        }

但是这会出现错误“ InvalidStateError：对象处于无效状态。”

Answer 1

您正在尝试加载结果。移动onload函数中的console.log（images）。

const confirm = () => {
        var reader = new FileReader();
        let images = [];
        reader.onload = function(e) {
            images.push(e.target.result);
             console.log(images);
        };
        reader.readAsDataURL(formValues.images[0].file);
        console.log('images base 64');          
    };