如何编码本地存储中的图像数组？

Question

如何对本地存储中的图像数组进行编码？

我无法将图像数组（base64）放入本地存储。我想更新输入中的（base64）以将其更新到服务器中。请帮助我，谢谢！

<input type="file" class="file-upload" id="fileUpload">

ready(){
    super.ready();
    this.$.fileUpload.addEventListener('change', (e) => {
        var filesToUpload = this.$.fileUpload;
        var files = filesToUpload.files;
        var maxFiles = files.length;
        var fd = new FormData();

        if (FileReader && files && files.length) {
            for (var i = 0; i < maxFiles; i++) {
                (function(file){
                    var name = file.name;
                    var fr = new FileReader();
                    fr.onload = function(image) {
                        return function(evt) {
                            image.src = evt.target.result;
                        }
                        var arr = [];
                        arr.push(fr.result);

                        if (arr.length == files.length){
                            console.log(arr);
                            localStorage.setItem('arr', JSON.stringify(arr));
                        }
                        // arr.push(fr.result);              
                            // var arr = JSON.parse(localStorage.getItem('arr')) || [];            
                            // arr = fr.result; 
                            // localStorage.setItem('arr', JSON.stringify(arr));

                    }
                    fr.readAsDataURL(file);
                })(files[i]);
            }
        }
    });
}

Answer 1

我认为您应该将var arr = [];移出循环

Answer 2

我成功做到了！ 我喜欢与查看此内容的人分享。

<input type="file" class="file-upload" id="fileUpload">
<vaadin-button on-tap="submit">Submit</vaadin-button>

submit(e) {

    e.preventDefault();

    var list = !!localStorage.getItem('imageData') ? JSON.parse(localStorage.getItem('imageData')) : [];
    var input = this.$.fileUpload;
    var files = input.files;

    var reader = new FileReader();
    reader.onload = function(e) {
        // localStorage["imageData"] = reader.result;
        list.push(reader.result);
        localStorage["imageData"] = JSON.stringify(list);
    };
    reader.readAsDataURL(files[0]);

}