OS-Ubuntu 18.04 电子-6.1.5 vue-cli-plugin-electron-builder-1.4.2 Vue-2.6.10 验证-2.1.12 节点-10.13.0
我有一个应用程序,允许用户上传图像并通过查看器js https://github.com/fengyuanchen/viewerjs
在图库视图中显示它们。
上传后,我会通过电子的主要过程在本地写入图像(我写这是为了减少内存
约束)。写入图像后,写入完成后,我会向渲染器进程发送一个具有唯一ID的事件。
我使用唯一的ID作为文件名来存储图像,以便可以通过此ID检索它以将其集成到图库中。
当我从渲染器中的主进程接收到事件和ID时,我将ID推入“ doc Transactions”数组中。
为了填充查看器画布中的图像,我遍历“ doc Transactions”数组,并尝试创建一个像这样的画布:
<ul ref="images" class="showImage">
<li v-for="(image, index) in docsAdded" :key="index">
<img
:src="getLocation(image._id)">
</li>
</ul>
methods:{
getLocation(id){
const userDataPath = remote.app.getPath("userData");
const filename = `${id}.png`
let imagesLoc = require.context(userDataPath, true, /\.png$/);
return imagesLoc("./" + filename);
}
}
这在加载图像时无济于事,但由于某种原因,它不断地反复编译。 当我使用静态文件名测试它时,它会完美工作:
methods:{
getLocation(id){
const userDataPath = remote.app.getPath("userData");
let imagesLoc = require.context(userDataPath, true, /\.png$/);
return imagesLoc("./" + "ck3ofcy4499904a5q2asg1xq0.png");
}
}
在我看来,该问题似乎是由于动态文件名而触发的。
很长一段时间以来,我一直坚持不懈地寻求帮助,对此将不胜感激。