vue監測數據改變的原理

• Vue監測數據改變的原理
• • Vue實例中的_data原理(對象)
  • Vue.set()
  • Vue實例中的_data原理(數組)
  • • 修改Vue數組
    • 替換數組

Vue監測數據改變的原理

只要你改變數據(調用setter),Vue就會重新解析模板, 重新渲染(diff虛擬dom, 渲染)

Vue實例中的_data原理(對象)

Vue對象下的屬性都有getter/setter

Vue.set()

只能給data內的屬性添加key, 不能在_data上添加.
因為:



所以:

Vue實例中的_data原理(數組)

不可以根據數組索引賦值, 這樣不會動態渲染

修改Vue數組

// this.student.hobby.splice(0, 1, '開車') this.$set(this.student.hobby, 0, '開車') Vue.set()

修改數組要用以下方法:
Vue重寫了下列方法(調用原本的方法, 然后渲染)
.
還可以
(數據代理: vm._data.student === vm.student)

替換數組

替換就是賦值啦

總結

以上是生活随笔為你收集整理的前端之vue监测数据改变的原理的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。