在Vue中使用CSS圖片,我們可以使用Vue的綁定語法,將圖片路徑綁定到對應的DOM元素上。例如,我們有一個圖片路徑為“images/vue-logo.png”的img元素:
<img src="images/vue-logo.png">
我們可以將圖片路徑綁定到vue實例的data中:
data: {
imgSrc: 'images/vue-logo.png'
}
然后在img元素中使用vue的綁定語法,將圖片路徑綁定到src屬性上:
<img :src="imgSrc">
除了使用圖片路徑綁定外,我們還可以使用CSS屬性background-image來設置CSS圖片。例如:
<div :style="{ backgroundImage: 'url(' + imgSrc + ')' }"></div>
這個例子中,我們將imgSrc綁定到一個div元素的backgroundImage屬性上,以展示一個CSS圖片。
上一篇vue和貓餅
下一篇es數據導出json