vue.js几个简单的指令v-bind,v-for,v-model,v-if

v-bind:你需要绑定的属性名称，可以简写,:属性名称

<td v-bind:vl="item.Id">{{item.Id}}</td>
<td :vl="item.Id">{{item.UserName}}</td>

v-model：给input绑定model

<div id="app-6">
    <p>{{ message }}</p>
    <input v-model="message">
</div>

<script>
    var app6 = new Vue({
        el: '#app-6',
        data: {
            message: 'Hello Vue!'
        }
    })
</script>

v-for:循环指令

<div id="content">
    <table>
        <tr v-for="item in userinfo">
            <td v-bind:vl="item.Id">{{item.Id}}</td>
            <td :vl="item.Id">{{item.UserName}}</td>
            <td>{{item.Number}}</td>
            <td>{{item.UserClass}}</td>
            <td><a href="#" @@click="handlerRemove">删除</a></td>
        </tr>
    </table>
</div>

v-if:条件判断，做显示隐藏等等

<div id="app-3">
    <p v-if="seen">现在你看到我了</p>
</div>
<script>
    var app = new Vue({
        el: "#app-3",
        data: {
            seen: false
        }
    })
</script>

用作判断：

<td v-bind:checktype="item.CheckType">
    <span v-if="item.CheckType==1" class="label label-success">审核成功</span>
    <span v-else-if="item.CheckType==2" class="label label-info">正在审核</span>
    <span v-else class="label label-danger">审核失败</span>
</td>

v-on:事件名称="事件处理的方法，在methods写" 可以简写