我正在尝试使用 v-bind 显示动态图像,但它不起作用 在模板标签中:
<img v-bind:src="test" />
在脚本标签中:
data() {
return {
items: [],
imagesref: "",
test: '~/assets/captures/ref_01_03_2022_17_05_21/@DHRD-52484/user language check dates in different language/1.png'
};
我厌倦了在 img 标签上使用测试路径来检查路径是否有问题,但它工作正常。 我该如何解决这个问题
最佳答案
v-bind:src
按预期工作。问题是您的路径在您的网页上下文中没有意义。
要将项目路径转换为 Web 路径,请使用 vue-loader
.即:
test: require('./relative/path/to/image.png')
或者您可以利用现有的 transform rules .
注意:这可能因配置而异,但在标准 Vue 项目中,将 ~/assets
替换为 @/assets
应该可以解决问题,而不需要 require()
。
关于vue.js - 带有v-bind的img src不显示图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71490048/