<h1>v-bind 绑定指令</h1>
<hr>
<div id="app">
<div :class="className">1、绑定classA</div>
<div :class="{classA:isOk}">2、绑定class中的判断</div>
<div :class="[classA,classB]">3、绑定class中的数组</div>
<div :class="isOk?classA:classB">4、绑定class中的三元表达式判断</div>
<br>
<div :style="{color:red,fontSize:font}">5、绑定style</div>
<div :style="styleObject">6、用对象绑定style样式</div>
</div>
<script type="text/javascript">
var app=new Vue({
el:'#app',
data:{
className:'classA',
isOk:true,
classA:'classA',
classB:'classB',
red:'red',
font:'18px',
styleObject:{
color:'block',
fontSize:'50px'
}
}
})
</script>