vue学习笔记9——v-pre，v-once，v-clock

** 回顾以前所有的指令以及今天的三个指令**

• v-text 输出渲染后的值
• v-html 输出解析HTML元素后的值
• v-if 条件判断
• v-else-if
• v-else
• v-for 循环
• v-model 表单双向数据绑定
• v-show 控制元素显示与隐藏
• v-bind 绑定元素的属性和style
• v-on 绑定事件
• v-pre 原样输出
• v-clock 渲染完之后才显示，防止将{{message}}类似的输出到页面
• v-once 只渲染一次

** 小例子**

<div id="app" v-pre>
    {{message}}
</div>
var vm = new Vue({
    el : '#app',
    data : {
        message : 'hello world'
    }
})

结果：{{message}}

<div id="app">
    <p>{{count}}</p>
    <button v-on:click="add">add</button>
    <p v-once>{{count}}</p>
</div>
var app = new Vue({
    el : '#app',
    data : {
        count : 1
    },
    methods : {
        add : function(){
            this.count++;
        }
    }
})

结果：上面的message一直在增加，下面有once的message只渲染了1之后就不变了