vue找不到vuetify v-img元素的动态源
我需要使用vuetify动态加载图像（从文件系统而不是url）。但是，当我在v-img元素中绑定路径变量时，vue找不到它。当我使用“required”方法静态地放置它时，它是ok的。
如何使用vuetify选择动态路径？这是文件加载器的问题吗？
我希望在运行时动态地选择映像。例如，如果我有“下一步”按钮，我想加载下一个图像。下面是Vue.js中的代码
<html>
<v-img
v-bind:src="require(myPath)"
aspect-ratio="1.5"
max-height="500"
contain
/>
</html>
<script>
data: () => ({
mycount: 1,
myPath: "../myimages/2.png"
})
</script>
[Vue警告]：错误的渲染：错误：找不到模块'.../myiamges/2.png'中找到-
共有3个答案
你也可以这样做：
<v-img
:src="`${image-variable}`">
</v-img>
这在Vuetify 1.5中起作用
尝试使用计算属性，例如：
<html>
<v-img
v-bind:src="require(imageSrc)"
aspect-ratio="1.5"
max-height="500"
contain
/>
</html>
<script>
data: () => ({
mycount: 1,
myPath: "../myimages/2.png"
}),
computed: {
imageSrc() {
return this.myPath;
}
}
</script>
这将使imageSrc成为一个动态变量，但您说过要单击“下一步”按钮，此单击需要更改“myPath”值，然后“imageSrc”将更改，v-img将获得此新值；
经过长时间的研究和尝试，我找到了自己问题的答案。
这里的问题在于“require”方法。在编译期间，当我使用动态路径时，它需要知道图像所在的文件夹。看这里。因此，动态地给出包含文件名的路径不会使“require”方法仅识别文件夹。那是我的解释。
所以我修改了这样的代码，它对我起了作用：
<html>
<v-img
v-bind:src="require('../myimages/' + myFilename)"
aspect-ratio="1.5"
max-height="500"
contain
/>
</html>
<script>
data: () => ({
mycount: 1,
myFilename: "2.png"
})
</script>
在这种情况下，我可以在运行时更改myFilename，它也可以工作。
-
有人能告诉我为什么下面的代码不返回表情符号属性吗... 但是下面的代码将返回一个表情符号属性... 我知道我已经将滚动添加到第二个代码中，所以它会查看整个页面并返回我要查找的元素。但除此之外，它们或多或少是相同的。我可以每隔几秒钟运行第一个代码，它永远找不到表情符号元素。它会发现代码和optCriteria没有问题，并将它们作为tradeCriteria打印在一起，但即使它在那里，它也永远找不到表
-
概述 <img>元素用于插入图片，主要继承了 HTMLImageElement 接口。 浏览器提供一个原生构造函数Image，用于生成HTMLImageElement实例。 var img = new Image(); img instanceof Image // true img instanceof HTMLImageElement // true Image构造函数可以接受两个整数作为参
-
我已经写了下面的代码来选择单选按钮，它的工作很好，但今天它不工作了。请找到代码和相应的错误消息 代码1： 错误1：“线程”main“org.openqa.selenium.TimeoutException中出现异常：等待存在由：By.id:0_2485a_startdate定位的元素10秒后超时” 代码2： 错误2:“线程”main“org.openqa.selenium.TimeoutExcep
-
动态img src由Webpack的要求处理： 如何在使用Rollup的vite应用程序上实现这一点？
-
我有一个输入框，就像我在这里用来输入我的问题，它的HTML是 每次，我都会尝试输入一些文本 我明白错误了-
-
任何提示都会很有帮助！