vuex源碼太枯燥 ? 擼一個 !

Vuex 是什麼 ?

Vuex 是一個專爲 Vue.js 應用程序開發的狀態管理模式。它採用集中式存儲管理應用的全部組件的狀態，並以相應的規則保證狀態以一種可預測的方式發生變化。

vuex

Vuex 核心概念

• State (單一狀態樹,數據共享數據存儲)

• Getter (Vuex 的計算屬性,從 state 派生狀態)

• Mutation (更改 Vuex state 的惟一方法,同步操做)

• Action (異步操做處理方法,提交 mutation 來更改 state,而不是直接變動)

vllx 作了哪些基本實現?

vllx 對 vuex 源碼進行了拆分簡化,讓源碼讀起來更簡單易懂,也讓你經過這個簡版的 vllx 理解 vuex 的核心實現,vllx 實現瞭如下功能:

• Vuex.Store 構造器選項

  ✅ state

  ✅ mutations

  ✅ actions

  ✅ getters

• Vuex.Store 實例方法

  ✅ commit

  ✅ dispatch

vllx 實踐

1. Vue.use(vuex) 作了什麼？

2. Vue computed 和 Vuex state 如何實現響應 ？

3. Vuex.Store 核心方法 commit,dispatch 的實現 ！

4. 爲何說 Vuex getter 至關於 Vue 的 computed ?

demo 使用了 JavaScript modules,須要啓動 web 服務器來調試 !

❤️ 結語

若是你和我同樣對前端感興趣,也喜歡"動手",歡迎關注個人博客一塊兒玩耍啊~