vue中設置背景圖片的方式

第一種：是用前端的靜態圖片做背景：

只需要在外層div中加入

 <div :style="conTop"> <div> 

這個style的內容寫在data中

data() {
    return {
        conTop: {
            backgroundImage:'url(' + require('./images/xxx..jpg') + ')',
            backgroundRepeat:'no-repeat',
            backgroundSize: cover;<!-- 響應式 -->
    }

}

 

一定是要加require包裹路徑

第二種:是用url來插入圖片（pic為一個包含url的對象）

  let pic = { url : 'xxx.xxx.xx' }// 絕對路徑   

直接就是

 backgroundImage ：'url(' + pic.url +')';