Vue数据绑定img标签的src属性,需要用require包裹
vue里面将img标签的src属性动态绑定到一个数组上,发现:src=’ '并没有软用,查了一些文章,终于发现是要用require包裹起来才行!<template><div ><div v-for="item in img_list" :key="item.index">{{item.title}}...
·
vue里面将img标签的src属性动态绑定到一个数组上,发现:src=’ '并没有软用,查了一些文章,终于发现是要用require包裹起来才行!
<template>
<div >
<div v-for="item in img_list" :key="item.index">
{{item.title}}
<img :src="item.imgSrc" alt="">
</div>
</div>
</template>
<script>
export default {
data() {
return {
img_list:[
//用require()包裹路径之后,图片才可以显示!
// {
// imgSrc:require('@/assets/avtar.jpg')
// },
// {
// imgSrc:require('@/assets/avtar.jpg')
// },
// {
// imgSrc:require('@/assets/avtar.jpg')
// },
{
title:'hello',
//未用require()包裹路径浏览器是显示不出图片的,且不会报错
imgSrc:'@/assets/avtar.jpg'
}
]
}
},
}
</script>
更多推荐
已为社区贡献1条内容
所有评论(0)