Vuejs的學習筆記1 響應式原理

2021-07-24 02:23:08 字數 578 閱讀 1132

vuejs採用的基於依賴收集的觀測機制

1 將原生的資料改造成可觀測物件,乙個可觀測的物件可以被取值,也可以被賦值

2 在watcher的求值過程中,每乙個被取值的可觀測物件都會將當前的watcher註冊為自己的乙個訂閱者,並成為當前watcher的乙個依賴。

3 當乙個被依賴的可觀察物件被賦值時,它會通知所有訂閱自己的watcher重新求值,並觸發相應的更新。

vuejs利用了es5的object.defineproperty方法,直接將原生資料的物件的屬性改造成getter和setter。(這是es5的特性,所以vue不支援ie8及以下版本的原因)。在這兩個函式裡面實現依賴的收集和觸發,而且完美的支援巢狀的物件結構。對於陣列,則通過包裹資料的可變的方法來監聽陣列的變化。使得vuejs的資料和操作原生的物件幾乎沒有區別。

1  vue在初始化例項時將屬性轉化成getter/setter。 所以屬性必須在data物件上才能讓vue轉換它,這樣才能讓她響應

2 受現代js的限制vue不能檢測物件屬性的新增或者刪除

頁面並不會因為delete 顯示為undefined

3  例項建立後要新增響應屬性的方法可以用$set

響應式筆記(1)

一 查詢 查詢可以讓我們根據裝置顯示器的特性 如視口寬度 螢幕比例 裝置方向 橫向或縱向 為其設定css樣式,查詢由 型別和乙個或多個檢測 特性的條件表示式組成。語法1 media mediatype and not only media feature 例項如果文件寬度小於 300 畫素則修改背景...

響應式開發學習筆記

media 型別 and 特性 max width 是 特性中最常用的乙個特性,其意思是指 型別小於或等於指定的寬度時,樣式生效。如 media screen and max width 480px 上面表示的是 當螢幕小於或等於480px時,頁面中的廣告區塊 ads 都將被隱藏。min width...

media響應式 前端學習筆記

media響應式 1 什麼是多 查詢?查詢是指 通過查詢出訪問我們網頁的裝置的 型別,來決定使用何種樣式。2 作用 多 的解決問題是什麼?查詢的作用為 為了解決在不同 型別上,網頁的排版,顯示,樣式等問題 3 語法 多 查詢的基本語法 media not only mediatype and exp...