Vue官方文檔介紹如下：
當你把一個普通的 JavaScript 對象傳入 Vue 實例作為
data選項键袱，Vue 將遍歷此對象所有的 property谒获，并使用Object.defineProperty把這些 property 全部轉為 getter/setter桃纯。Object.defineProperty是 ES5 中一個無法 shim 的特性睦裳，這也就是 Vue 不支持 IE8 以及更低版本瀏覽器的原因。
這些 getter/setter 對用戶來說是不可見的仙畦，但是在內部它們讓 Vue 能夠追蹤依賴输涕，在 property 被訪問和修改時通知變更。這里需要注意的是不同瀏覽器在控制臺打印數(shù)據(jù)對象時對 getter/setter 的格式化并不同慨畸，所以建議安裝 vue-devtools 來獲取對檢查數(shù)據(jù)更加友好的用戶界面莱坎。
每個組件實例都對應一個 watcher 實例，它會在組件渲染的過程中把“接觸”過的數(shù)據(jù) property 記錄為依賴寸士。之后當依賴項的 setter 觸發(fā)時檐什，會通知 watcher，從而使它關聯(lián)的組件重新渲染弱卡。
<template>
<div id="app">
{{ data }}
<button @click="addData">加1</button>
</div>
</template>
<script>
export default {
name: "App",
data() {
return {
data: 2,
};
},
methods: {
addData() {
this.data += 1;
},
},
};
</script>
當 data 對象被傳入 new Vue()乃正，這個 data 會被 Vue 監(jiān)聽，所謂監(jiān)聽就是Vue利用Object.defineProperty把 data 中的每個屬性都修改成 get 和 set婶博，然后通過 vm(Vue 的實例)來代理瓮具，這樣每次對 data 的讀寫都會被 Vue 監(jiān)控，然后 Vue 會將 data 更新到 UI 層凡人。
Object.defineProperty方法會直接在一個對象上定義一個新屬性名党，或者修改一個對象的現(xiàn)有屬性，并返回此對象挠轴。
