vue动态style添加背景图backgroundImage,结合computed
vue动态style添加背景图backgroundImage,结合computed三、也可以直接写在标签上
·
一、vue涉及到图片需要用require,注意单引号/双引号的使用
<template v-for="(item,index) in menu">
<div :key="item.id"
:style="{backgroundImage:'url('+itemImg(item)+')'}">
</div>
</template>
二、需要传参的话要用闭包的形式接收参数
computed:{
itemImg() {
return (item) => {
return require(`../assets/image/main/menu_${item.id}.png`)
}
}
}
三、也可以直接写在标签上
<template v-for="(item,index) in menu">
<div :key="item.menuId"
:style="{backgroundImage:'url('+require(`../assets/image/main/menu_${item.id}.png`)+')'}">
</div>
</template>
更多推荐
已为社区贡献7条内容
所有评论(0)