electron-vue fs 读取本地图片,并展示

2,218 阅读1分钟

效果:

image.png

获取到文件弹窗选择的图片地址,利用fs来加载本地图片

 fs.readFile(item, function (err, data) {
    if (err) {
        // console.log(err);
         } else {
         // base64图片编码字符串
        imgSrcList.push("data:image/jpg;base64," + data.toString('base64'));
                        }
                    })
<img :src="imgSrc" v-for="(imgSrc,index) of imgSrcList" :key="index">

fs.readFile()读取到文件流 利用 data.toString('base64') 会转为base64(不包含data:image/jpg;base64,) 图片显示的时候是需要设置 data:image/jpg;base64, 每次动态拼凑就可以显示图片了

image.png