vue使用splice操作数组更新页面

直接对数组元素赋值，是不会更新视图的。要使用arr.splice()方法更新数组，才会更新视图。

 <template>
 <div>
      <ul>
          <li v-for="(item,i) in arr">{{item}}</li>
      </ul>

      <button @click="wrong">失效</button>
      <button @click="correct">生效</button>
 </div>
 </template>
 <script>
 export default {
   name: "Home",
   data () {
     return {
         arr:[1,2,3]
     };
   },
   methods: {
       wrong(){
           this.arr[0] = 9;   // 视图不会更新，页面上还是1，2，3
       },

       correct(){
           this.arr.splice(0,1,9); // 视图更新了，页面上是9，2，3
       }
       
   },
 }
 </script>
 <style lang="css" scoped>
 </style>