v-for和v-once的用法

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/cristina_song/article/details/82766334

<template>
    <div id="app">
        <h1>Hello Vuex</h1>
       <p>{{aaa}}</p>
       <button @click="add">+</button>
       <button @click="sub">-</button>  
       <ul>
           <li v-for="(item,index) in items">
               {{index}}--{{item.message}}
           </li>
       </ul> 
       <p v-once>原始数据：{{aaa}}</p> 
       <p>修改过的数据：{{aaa}}</p>    
    </div>

</template>

<script>
export default {
    data(){
        return{
            aaa:2,
            items:[
                {message:'first'},
                {message:'second'}
            ]
        }
    },
    methods:{
        add:function(){
            this.aaa++
        },
        sub:function(){
            this.aaa--
        }

    }
}
</script>