在Vue中未调用图片加载

Question

我正在尝试构建Vue应用程序，并且对Vue还是陌生的，我正在尝试使用以下代码在运行时在Js / Ts中加载图像

console.log("code is being called");
let image = new Image();
image.onload = (event) => {
console.log("image loaded");
}
image.src = "static/prison_tileset.png";

该代码在常规的html文件上可以正常工作，但是在Vue中，不会调用onload方法。第一个console.log被调用。我确信可以找到该图像，因为如果我故意操纵错误路径，则会收到未找到该文件的错误。只是onload事件没有被触发。

如果有人可以帮助我，我会很高兴！

Answer 1

我已经开始工作了！我将尽我所能回答这个问题。要在视图中使用本地资产，您必须像这样通过Webpack加载它们：

const Logo = require("../assets/logo.png");
this.image.src = Logo;

如果您也碰巧使用了电子，则必须将条目文件中的webSecurity设置为false，以允许电子访问本地文件。