VUE 字符串拼接 各种拼接
1. :style同时绑定对象与属性:style="[{color: this.color}, this.layout == 'left'? this.item:this.item]"2. 字符串拼接:id="['ecahrt'+n+'-layout'+layout]"3. 绑定数值与字符串数值:class="
·
1. :style 同时绑定对象与属性
<div :style="{ color : fontColor }"> </div>
<div :style=" fontColor == '#f00' ? 'style1' : 'style2' "> </div>
<div :style="[{ color : fontColor }, fontColor == '#f00' ? 'style1' :' style2' ]"> </div>
data(){
return {
fontColor: '#f00'
}
}
.style1 {background: #fff;}
.style2 {background: #0f0;}
2. 字符串拼接
:class="[ 'string' + index, 'string2' ]"
:action=" path + 'string' "
data(){
return {
index: 10,
path: 'http://192.168.123.456:port'
}
}
3. 绑定数值 与字符串数值 true则加载,false则忽略
:class="{ red : index == 2 , [ 'layout' + index ] : true }"
更多推荐
已为社区贡献4条内容
所有评论(0)