笔记：VUE 语法

一、绑定类名。

<div
  class="static"
  :class="{ active: isActive, 'text-danger': hasError }"
></div>

类名active和text-danger取决于变量isActive和hasError的布尔值真假

二、绑定内联样式。

<div :style="{ color: activeColor, fontSize: fontSize + 'px' }"></div>

也可以直接绑定到一个对象

<div :style="styleObject"></div>

data: {
  styleObject: {
    color: 'red',
    fontSize: '13px'
  }
}

三、v-for和v-if同时使用的问题
v-for渲染比v-if具有更高的优先级。
一般将v-if放在v-for的外层盒子元素上。
四、遍历对象时。
可以有三个参数 依次为 值、键、索引。

<div v-for="(value, name, index) in object">
  {{ index }}. {{ name }}: {{ value }}
</div>