vue模板语法中的类和样式绑定
最近公司要求，在学习前端vue知识，记录一些语法要点
在绑定类和样式时，如果使用三目运算(三元运算)时，html中使用的是大括号[],
以及使用数组绑定多个class时，也是大括号，
其他的使用中括号{}
比如：
绑定class
<!--三目运算-->
<div :class="[isAcitive?redClass:errorClass]"></div><!--数组绑定多个class-->
<div :class="[redClass,errorClass]"></div>
<!--绑定一个对象，使用中括号{} -->
<div :class="{'activeClass':isActive,'errorClass':hasError}"></div>
<!--注意：如果中括号内类只能加单引号，或者不加引号，直接写如下-->
<div :class="{activeClass:isActive,errorClass:hasError}"></div><div :class="{'activeClass':isActive}"></div>绑定样式用法：
- 绑定多个样式
<div :style="{color:activeColor,fontSize:activeFontSize}"></div> 或者 <div :style="{'color':activeColor,'fontSize':activeFontSize}"></div> -
绑定一个对象样式
<div :style="styleObject"></div><script>const styleObject={color:'red',fontSize:'18px'} </script> - 绑定样式数组
<div :style="[styleObject,overridingStyles]"></div><script>const styleObject={color:'red',fontSize:'18px'}const overridingStyles={width:'100px',height:'100px',backgroud:'blue'} </script>