vue資料的雙向繫結的理解

2021-10-04 11:15:44 字數 550 閱讀 4109

資料***:observer.對資料的屬性進行監聽,如果發生變化,會告訴發布者。

發布者:通知訂閱者資料發生變了。(發布者會通知訂閱者更新檢視)

訂閱者:檢視元素訂閱的資料資訊。data下面的每乙個資料,都會有多個訂閱者。

訂閱者的職責:當資料發生變化時,會將與資料相關的元素屬性進行更新(更新檢視)* 訂閱者與資料的關係是多對一的。

編譯器:對html進行解析的,分析html,然後生成相對應的事件以及訂閱者。

watcher:資料***與編譯器的乙個橋梁。訂閱者(更新檢視)

總結:1、實現乙個資料***observer,對資料物件的所有屬性進行監聽,當資料發生變化時,通知與該資料相關的所有訂閱者。

2、實現乙個html解析器 對每個元素進行解析,根據其相對應的屬性,為其增加訂閱者或繫結事件。

3、watcher:生成訂閱者

雙向繫結:通過資料***,以及html解析器再加上乙個訂閱者生成器來完成的。 在對資料監聽時,可以根據資料的變化去通知相對應的資料訂閱者,讓你的訂閱者更新檢視。 當檢視影響到資料時,資料會發生變化。當資料變化,再次通知訂閱者。

怎麼理解vue的資料雙向繫結

指的是我們先把模板寫好,然後把模板和資料 資料可能來自後台 整合到一起形成html 然後把這段html 插入到文件流裡面。單向資料繫結缺點 html 一旦生成完以後,就沒有辦法再變了,如果有新的資料來了,那就必須把之前的html 去掉,再重新把新的資料和模板一起整合後插入到文件流中。簡單的來說就是d...

輕鬆理解vue的雙向資料繫結問題

vue介紹 vue是當前很火的一款mvvm的輕量級框架,它是以資料驅動和元件化的思想構建的。因為它提供了簡潔易於理解的api,使得我們很容易上手。vue與mvvm 如果你之前已經習慣了用jquery操作dom,學習vue.js時請先拋開手動操作dom的思維,因為vue.js是資料驅動的,你無需手動操...

vue的雙向資料繫結

原理 vue實現雙向資料繫結的原理就是利用了 object.defineproperty 這個方法重新定義了物件獲取屬性值 get 和設定屬性值 set 的操作來實現的。它接收三個引數,要操作的物件,要定義或修改的物件屬性名,屬性描述符。重點就是最後的屬性描述符。屬性描述符是乙個物件,主要有兩種形式...