前端vue前端

【前端案例】05 - vue实现将background属性动态绑

2020-11-20  本文已影响0人  itlu
  1. 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')},
        ]
      }
  1. 在标签中进行遍历:
<!-- 动态设置盒子背景 :style="{background :'url(' + item.url + ')'}" -->
<div class="banner_bg" :style="{background :'url(' + item.url + ')'}"></div>
上一篇下一篇

猜你喜欢

热点阅读