知識總結 Vue

2021-10-07 12:38:29 字數 1625 閱讀 5045

對某些資料的修改就能自動更新檢視,讓開發者不用再去操作dom,有更多的時間去思考業務邏輯。

首先vue最核心的兩個特點,響應式元件化

響應式:這也就是vue.js最大的優點,通過mvvm思想實現資料的雙向繫結,通過虛擬dom讓我們可以用資料來操作dom,而不必去操作真實的dom,提公升了效能。且讓開發者有更多的時間去思考業務邏輯。

元件化:把乙個單頁應用中的各個模組拆分到乙個個元件當中,或者把一些公共的部分抽離出來做成乙個可復用的元件。所以元件化帶來的好處就是,提高了開發效率,方便重複使用,使專案的可維護性更強。

虛擬dom,當然,這個不是vue中獨有的。

缺點:基於物件配置檔案的寫法,也就是options寫法,開發時不利於對乙個屬性的查詢。另外一些缺點,在小專案中感覺不太出什麼,vuex的魔法字串,對ts的支援。相容性上存在一些問題。不利於seo;導航不可用,如果一定要導航需要自行實現前進、後退。(由於是單頁面不能用瀏覽器的前進後退功能,所以需要自己建立堆疊管理);初次載入時耗時多

01.  顯示上不同

最明顯的是在顯示上,hash模式的url中會夾雜著#號,而history沒有

02. vue底層對它們的實現方式不同

hash模式是依靠onhashchange事件(監聽location.hash的改變)

history模式是主要是依靠的tml5 history中新增的兩個方法,pushstate()可以改變url位址且不會傳送請求,replacestate()可以讀取歷史記錄棧,還可以對瀏覽器記錄進行修改。

當真正需要通過url向後端傳送http請求的時候,比如常見的使用者手動輸入url後回車,或者是重新整理(重啟)瀏覽器,這時候history模式需要後端的支援。因為history模式下,前端的url必須和實際向後端傳送請求的url一致,例如有乙個url是帶有路徑path的(例如www.lindaidai.wang/blogs/id),如果後端沒有對這個路徑做處理的話,就會返回404錯誤。所以需要後端增加乙個覆蓋所有情況的候選資源,一般會配合前端給出的乙個404頁面

hash:

window.onhashchange = function(event)
用 import 來按需引入,或者借助babel-plugin-import實現

vue知識總結

對mvvm開發模式的理解 mvvm指model view 和 viewmodel,其中 v show v if v for的優先順序 v for v if v show 簡述vue的響應式原理 官網鏈結 vue 最獨特的特性之一,是其非侵入性的響應式系統。注 非侵入性指使用者的業務邏輯 不依賴於具體...

Vue 知識點總結

1.mvvm?對比mvc mvvm model view viewmodel model 資料模型,可以定義資料修改和操作的業務邏輯 view ui元件,將資料元件轉換成ui展示 viewmodel 同步view和model的物件 view和model沒有直接的聯絡,通過viewmodel進行互動,...

Vue知識點總結

框架與庫的區別 jquery庫 dom操作 http請求 全家桶 如何起步 插值表示式 常用指令 全域性元件 場景 公共性功能元件,減少冗餘 全域性api vue.component 元件名 元件物件 過濾器 給資料的顯示進行操作,如反轉,改變屬性等 filter 全域性過濾器,vue.filter...