<template>
  <div id="root">
    <!-- <p v-for="item in names" :key="item">{{item}}</p> -->
    <p v-for="item in list" :key="item">{{item.name}}</p>
    <button class="button" @click="upd">點我</button>
  </div>
</template>

<script>

export default {
  data(){
    return{
      names:["jack","alice","kate"],
      list:[
        {
          name :'jack'
        },
        {
          name :'alice'
        },
        {
          name :'kate'
        }
      ]
    }
  },
  methods:{
    upd(){
    //  this.names[0] = "john" 直接複製沒用
    //  this.$set(this.names,0,'john')
    this.$set(this.list[0],'name','john')
    }
  }
}
</script>