vue 背景图设置

在data中创建:

data () {
    return {
      // 背景图片
      background: {
          // 背景图片地址  require()
        backgroundImage: 'url(' + require(' 图片地址 ') + ')',
        // 背景图是否重复
        backgroundRepeat: 'no-repeat',
        // 背景图片大小
        backgroundSize: 'cover',
        // 背景颜色
        backgroundColor: '#000',
        // 背景图片位置
        backgroundPosition: 'center top'
      }
    }
  }
}

在html中：

 <div :style="background" class="bg">
 </div> 

CSS中可设置宽高：

.bg{
width:100%;
height:150;
}