Vue v-bind
v-bind可以简写 :
-
v-bind对class的动态绑定
<!--动态绑定class JSON形式--> <!--1.class会和:class的内容合并，并不会存在替换。--> <!--2.:class后面的Boolean为true，则该类就会被激活--> <view class="类名3" :class="{类名:Boolean,类名2:Boolean}"></view> <!--动态绑定class 数组形式--> <!--1.class会和:class的内容合并，并不会存在替换。--> <!--2.数组形式绑定多个class--> <view class="类名3" :class="[类名1,类名2]"></view> -
v-bind对style的动态绑定
<!--动态绑定style JSON形式--> <!--1.style会和:style的内容合并--> <view style="border:solid 1px #000000" :style="{backgroundColor:'red'}"></view> <!--动态绑定style 数组形式--> <!--1.style会和:style的内容合并--> <view style="border:solid 1px #000000" :style="[backgroundStyle,]"></view> <script> export default{ data(){ return { backgroundStyle:{ backgroundColor:'#000000', width:'100rpx' } } } } </script>
