[log] vue動態的修改樣式
阿新 • • 發佈:2018-11-06
切換背景圖片
<div class="carlist" :style=imgurl></div>
imgurl:{ backgroundImage: "url(" + require("../../assets/nouse.png") + ")",},
動態給div加邊框
場景:點選地址時加上邊框,並設定為當前要使用的地址
<div class="c1" v-for="i in addresslist"
:id=i.AddrSeq @click="checkAddress(i.AddrSeq)" >
</div>
// 選擇地址
checkAddress(id) {
if (this.lastel != null) {
this.lastel.style.boxShadow = null
}
var el = document.getElementById(id)
this.lastel = el;
el.style. boxShadow = ' 0 2px 12px 0 #409EFF'
this.currentAddress = id;
},
切換class
<div class="footerstyle" :class="{'test2':isChoose}" >
</div>
<style lang="scss" scoped>
.footerstyle {
position: absolute;
bottom: 0px;
width: 100%;
height: 5%;
background-color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
.test2 {
background-color: #ff363d;
}
</style>
data() {
return {
isChoose:false,
};
}
methods: {
changeSubmit() {
this.isChoose = true
},