vue 內(nèi)聯(lián)樣式style中的background用法說明
在我們使用vue開發(fā)的時(shí)候 有很多時(shí)候我們需要用到背景圖
這個(gè)時(shí)候會直接使用 內(nèi)聯(lián)樣式 直接把你拿到的數(shù)據(jù)拼接上去
注意 在vue中直接使用style時(shí) 花括號一定別忘記
還有就是你的url一定要加引號拼接
:style = ' { backgroundImage : " url ( " + item.img + " ) " } '
完事!
補(bǔ)充:
好像還可以這樣寫
<div :style=" 'background-image' : ' url( ' + 內(nèi)容+' ) ' "></div>
更新一點(diǎn)
當(dāng)你的style設(shè)置背景色得時(shí)候是需要加{}得
但是如果是width這種就不用加了
over!
知識拓展:vue 在已有的購買列表中(數(shù)據(jù)庫返回的數(shù)據(jù))修改商品數(shù)量
連續(xù)加班一個(gè)月 連續(xù)通宵三天 到最后還是少了一個(gè)功能 心碎
簡介:一個(gè)生成好的商品列表(數(shù)據(jù)庫返回的數(shù)據(jù))
首先拿到我們需要渲染的數(shù)組
在data中定義
我是在測試的時(shí)候 直接寫了兩條數(shù)據(jù)
下面開始點(diǎn)擊刪除
點(diǎn)擊添加是一樣的代碼 只不過加號減號的區(qū)別
以上這篇vue 內(nèi)聯(lián)樣式style中的background用法說明就是小編分享給大家的全部內(nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue中用js如何實(shí)現(xiàn)循環(huán)可編輯表格
這篇文章主要介紹了vue中用js如何實(shí)現(xiàn)循環(huán)可編輯表格,具有很好的參考價(jià)值,希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-09-09vue項(xiàng)目中運(yùn)用webpack動態(tài)配置打包多種環(huán)境域名的方法
本人分享一個(gè)vue項(xiàng)目里,根據(jù)命令行輸入不同的命令,打包出不同環(huán)境域名的方法。需要的朋友跟隨小編一起看看吧2019-06-06vue 實(shí)現(xiàn)axios攔截、頁面跳轉(zhuǎn)和token 驗(yàn)證
這篇文章主要介紹了vue 實(shí)現(xiàn)axios攔截、頁面跳轉(zhuǎn)和token 驗(yàn)證,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-07-07Element中table組件按照屬性執(zhí)行合并操作詳解
在我們?nèi)粘i_發(fā)中,表格業(yè)務(wù)基本是必不可少的,對于老手來說確實(shí)簡單,家常便飯罷了,但是對于新手小白如何最快上手搞定需求呢?本文從思路開始著手,幫你快速搞定表格2022-11-11vue實(shí)現(xiàn)動態(tài)表格提交參數(shù)動態(tài)生成控件的操作
這篇文章主要介紹了vue實(shí)現(xiàn)動態(tài)表格提交參數(shù)動態(tài)生成控件的操作,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11