Javascript Vue DOM image赢得'；不能正确显示

我正在使用Vue框架，并使用

DomUtil.Create

函数创建图像。在这个图像中，我想动态地将源代码写入这个图像。但是图像不会显示给用户

我使用

标记在页面上放置了一个普通图像，它在这里工作。只有在创建DOM元素时，它才不起作用。我把路径硬编码在这里，这样就可以确定路径是正确的

使用

require（）

绑定到项目路径/文件名时，请使用

require

：

require（'@/assets/pictures/1.png'）；

如果在Vue CLI中使用项目资产路径和文件名，Webpack实际上会在绑定时重命名它们。如果在模板中为

img src

使用字符串路径，则Vue CLI会悄悄地处理此问题。但在任何其他情况下，您都需要手动使用Webpack的

require

在运行时提供正确的路径和文件名

-注意：您可以

npm运行build

，然后检查

dist

img

文件夹查看重命名-

---

我可以将变量与

require（）

一起使用吗？ 使用可变路径/文件名时，

require

需要一些帮助。必须至少将路径的第一部分硬编码为字符串

• 例如，这项工作：

constfilename='1.png'；
需要（'@/assets/pictures/'+文件名）；//谢谢，这很有效！我有一个小的后续问题。如果我实现了require（picturepath），我将得到一个警告，即依赖项的请求是一个表达式。那么我该如何在require函数中实现一个变量呢？不客气，让事情变得更复杂一点，
require
需要一些关于该路径的帮助，并且不能直接从变量中推断出来。仅在变量中输入图像名称，然后执行以下操作：
require（'@/assets/pictures/'+yourImgVariable）
var img = L.DomUtil.create("img", "popUpImg", divImg);
img.src = '@/assets/pictures/1.png';

const path = 'assets/pictures/1.png';
require('@/' + path); // <-- This is good enough too