vue v-for img标签的src 图片不显示
1.可能是绑定的:key值不能是对象或者数组 会报一下错误:[Vue warn]: Avoid using non-primitive value as key, use string/number value instead.<div class="banner"><mt-swipe :show-indicators="false" class="swipe...
·
1.可能是绑定的:key值不能是对象或者数组 会报一下错误:
[Vue warn]: Avoid using non-primitive value as key, use string/number value instead.
<div class="banner">
<mt-swipe :show-indicators="false" class="swipe">
<mt-swipe-item v-for="(item,index) in imges" :key="index">
<img :src="item.src"/>
</mt-swipe-item>
</mt-swipe>
</div>
key的值绑定下标index就好了
img标签里面绑定的src值不要用双大括号{{}}来装载,否则报错
最后引入图片也要注意;不要直接src:'../../../``````'
webpack官网大图告诉我们,资源经过loader处理,变成处理好的文件。如果不用require的话,图片资源是不会加入的
但是 具体 也是看项目的配置
// 正确的引入图片的方式
imges:[
{src:require("../../assets/imges/homePageSwipe/timg.jpg")},
{src:require("../../assets/imges/homePageSwipe/timg1.jpg")},
{src:require("../../assets/imges/homePageSwipe/timg2.jpg")},
{src:require("../../assets/imges/homePageSwipe/timg3.jpg")}
]
更多推荐
已为社区贡献1条内容
所有评论(0)