技術標籤：vue

前情提要：以下三種情況Vue 不能檢測陣列和物件的變化

1. 物件中 property 的新增或移除：testObj.a='引數' //testObj沒有引數a
2. 使用索引直接設定一個數組項：testArray[1]='陣列項'
3. 修改陣列長度：testArray.length = 4

此時就需用使用this.set()/this.$set()來保證他們的響應性。
(vm.$set是全域性Vue.set方法的別名)
一. 用法
this.$set( target, key, value )，其中：
target：要更改的資料來源(可以是物件或者陣列)
key：要更改的具體資料（物件屬性名或者陣列下標）

data() {
  return {
    testArray: [],
    testObj: {},
  }
},
created() {
  this.$set(this.testArray, 0, '1')
  this.$set(this.testObj, 'Name', 'name')
  console.log('陣列', this.testArray)
  console.log('物件', this.testObj)
}

三. 效果：

參考連結：
4. https://cn.vuejs.org/v2/guide/reactivity.html#%E6%A3%80%E6%B5%8B%E5%8F%98%E5%8C%96%E7%9A%84%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A1%B9