【前端案例】05 - vue实现将background属性动态绑
2020-11-20 本文已影响0人
itlu
- 在
vue
中的data
中 :放一个如下的对象数组
return {
imageList:[
{'id':1,'url':require('../assets/images/banner_1.jpg')},
{'id':2,'url':require('../assets/images/banner_3.jpg')},
{'id':3,'url':require('../assets/images/banner_3.jpg')},
{'id':4,'url':require('../assets/images/banner_1.jpg')},
{'id':5,'url':require('../assets/images/banner_1.jpg')},
]
}
- 在标签中进行遍历:
<!-- 动态设置盒子背景 :style="{background :'url(' + item.url + ')'}" -->
<div class="banner_bg" :style="{background :'url(' + item.url + ')'}"></div>