切换效果的实现:
1、做切换效果的技术(样式绑定)
2、组件或者模块的切换(动态组件 v-if/v-show)
3、路由切换(router)
样式绑定
(1) 对class 属性进行绑定
1、v-bind:class 指令也可以与普通的 class 属性共存
<div class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }">
2、<div v-bind:class="classObject"></div>
3、数组语法
<div v-bind:class="[isActive ? activeClass : '', errorClass]"></div>
<div v-bind:class="[{ active: isActive }, errorClass]"></div>
(2)对style 进行绑定
1、v-bind:style = "{color:'red'}"
2、:style = "[color:'red',fontSize]"
3、:style = "[{color:'red'},fontSize]"
标签:style,样式,绑定,color,class,red From: https://www.cnblogs.com/LIXI-/p/16639069.html