1、使用双括号（{{}}）对变量输出，内部可以写简单的表达式用于对数据的处理
一个花括号中只能输出一个变量
<div id="app"> <b>名字</b> </div> <b>{{name}}</b> //模板语法
2、v-text 相当于js的innerText
1. <div id=" app " > 2. <b>名字</b> 3. <b>名字</b> 4. </div> 5. 6. <b v-text="name"></b>
3、v-html 相当于js的innerHTML
1. <div id="app" > 2. <b>名字</b> 3. <b>名字</b> 4. <div> 5. <b>这是v-html输出的</b></div> 6. </div> 7. 8. <div v-html="html"></div>
4、v-bind 动态绑定属性，简写是冒号( ：)
1. <div v-bind:title="title">v-bind</div><! -- v-bind --> 2. <div :title="title +‘缩写'">v-bind缩写</div><! -- v-bind缩写-->
5、绑定clss
操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是 attribute，所以我们可以用 v-bind 处理它们：只需要通过表达式计算出字符串结果即可。不过，字符串拼接麻烦且易错。。因此，在将v-bind用于class和style时，Vue.js 做了专门的增强。表达式结果的类型除了字符串之外，还可以是对象或数组。
对象语法：
<div :class="{ active: isActive }"></div>
data() { return { isActive:true }; },
数组语法：
<div :class="[activeClass, errorClass]"></div>
data() { return { activeClass: "active", errorClass: "text-danger", }; },
