动态绑定属性

v-if：操作的是DOM，和v-else要连在一起写，不然会报错
v-show：操作的是样式
template是vue提供的用来包裹元素的标签，无实际意义，v-show不支持，v-if可以使用

这样点击只会操作label这个DOM，因为输入框一直没变，
浏览器就默认复用，加上key值表示唯一的时候，才会连同输入框的DOM一起切换
<div id="app">
    <button @click="cut=!cut">点击</button>
    <template v-if="cut">
        <label for="reg">注册</label>
        <input id="reg" type="text">
    </template>
    <template v-else>
        <label for="log">登录</label>
        <input id="log" type="text">
    </template>
</div>

v-bind简写 :：

动态绑定属性后面跟的是变量
<img :src="src" :width="w"/>

class，style属性没法直接绑定样式，解决方法有两种，第一种是对象，第二种方式是数组

    <!--1、{className: isActive}-->
    <div class="x" :class="{z:true, y: false}">嘻嘻嘻</div>
    <!--2、[] 数组绑定 可以嵌套对象-->
    <div class="x" :class="[class1, class2, {z:true}]">哈哈哈</div>
    <!--隔行变色-->
    <div v-for="(a, index) in 10" :class="{x: index%2}">{{a}}</div>