vue-simple-uploader 上传文件并预览

上传大文件照片，需要支持文件夹上传、分片上传、断点续传，因此选择vue-simple-uploader 插件。

需求：上传完后还需要通过查看详情，预览上传的照片，网上找了半天，也没发现相关文档，后来打印上传文件列表发现，fileList数组中file类型为File,想着FileReader应该可以将其转为base64位，实现预览，因此试了试没想到成功了。

files.fileList.forEach(item => {
          if (!item.isFolder) {
            const reader = new FileReader();
            // reader里面有个方法readAsDataURL 可以将图片转base64进制
            reader.readAsDataURL(item.file);
            // onload可以监听转换完成后
            reader.onload = () => {
              //imgUrl 即为转换成功后的base64图片地址
              item.imgUrl = reader.result;
            };
          }
        });
1
2
3
4
5
6
7
8
9
10
11
12