vue中的v-once指令

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

<div id="app">
      <p>{{a}}</p>
      <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:0
            },
            methods:{
                add(){
                 this.a++
                },
                minus(){
                 this.a--
                }
            }
        })
    </script>

运行效果如下：

加了v-once的效果

<div id="app" v-cloak>
      <p  v-once>{{a}}</p>
      <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:0
            },
            methods:{
                add(){
                 this.a++
                 console.log(this.a)
                },
                minus(){
                 this.a--
                 console.log(this.a)
                }
            }
        })
    </script>

运行效果如下：
视图无变化，数据还是在更新的