vue指令之v-once

v-once的作用是只会渲染对应元素一次，数据更新不会引起视图的更新，目的是为了优化页面的性能。

   <div id="app" v-clock>
        <h2 v-once>{{a}}</h2>
        <button @click="add">按我加1</button>
        <button @click="minus">按我减1</button>
    </div>
    <script src = "js/vue.js"></script>
    <script>
        var vue = new Vue({
            el: "#app",
            data: {
                a: 100
            },
            // 事件方法
            methods:{
                add() {
                       //点击使a加1
                    this.a ++
                    console.log(this.a)
                },
                minus() {
               //点击使a减1
                    this.a --
                    console.log(this.a)
                }
            }
        })
    </script>

此时我们可以在浏览器中看到：

 

 页面并无更新渲染但数据改变了。