在Vue中，一般只有在data選項中聲明的屬性（或者是屬性的屬性）才是具有響應特性的。如果需要在data選項之外對已有屬性添加（Vue 不允許動態添加根級響應式屬性）具有響應特性的屬性，需要用到Vue的set方法。
var vm = new Vue({
data: {
a: { //a就是根級屬性，不可動態添加
b: 0 //b就是屬性的屬性，可以動態添加
}
}
})
何為響應特性？就是當我們更改data中的值的時候，HTML與之綁定的部分會隨之更新的特性。
例1，Vue文檔中的例子
var vm = new Vue({
data: {
a: 1
}
})
// `vm.a` 現在是響應式的
vm.b = 2
// `vm.b` 不是響應式的
例1中的a就是在data中聲明的具有響應特性的屬性，而b就不是。
例2，把上面的例子修改一下
var vm = new Vue({
data: {
a: {
a1:''
}
},
methods: {
change: function () {
this.a.a1 = "test" //a1就是響應式的
this.a.a2 = "testtest" //a2就不是響應式的
}
}
})
在實際操作中，例2的a2雖然不是響應式的，但他卻是可以在HTML部分被渲染更新出來。這里就是一個比較容易掉進去的坑了。由于Vue是異步執行DOM更新，雖然更新的動作是由this.a.a1 = "test"觸發，可動作的完成是在this.a.a2 = "testtest"之后。
例3，一個更加完整的例子
var vm = new Vue({
data: {
a: {
a1:''
}
},
methods: {
change: function () {
this.a.a1 = "test" //a1就是響應式的
this.a.a2 = "testtest" //a2就不是響應式的
var that = this;
setTimeout(function () {
that.a.a3 = 'new text'; //這里與a2是相同的，卻別在于這里的a3并不會被渲染到DOM中
that.$set(that.a, 'a4', 'new text'); //這是正確的添加屬性的方法
that.a = { //這種寫法與a2不同，a5可以被更新到DOM中
a5: 'hahaha'
}
}, 1);
}
}
})
參考資料：
