三、vue-x核心內容
3.2 getter內容
3.3 mutation內容
3.4 action內容
3.5 module內容
vue-x是專為vue.js應用程式開發的狀態管理模式,提供乙個在多個元件間共享狀態的外掛程式。它的作用是將多個元件共享的變數全部儲存在乙個物件裡,物件是存放在頂層的vue例項中,可供其他元件進行使用。
3.1.1 state的單一狀態樹概念
單一狀態樹,也稱單一資料來源(single source of truth)。採用乙個store物件來管理應用層的全部狀態,這樣以便對資料的管理與維護。
3.2.1 getters的使用
對state的資料進行加工處理
const store =
newvuex.store(
getters:}}
);
}
3.3.1 mutations狀態更新
mutations是用來更新store狀態的唯一方式
const store =
newvuex.store
( mutations:
// 帶引數方法:
addnumparameter
(state,para)}}
);
通過commit呼叫store檔案裡mutations裡方法來修改的狀態3.3.2 mutations提交方式
普通方式提交
const store =
newvuex.store
(addnumparameter
(state,para)}}
);
型別方式提交
const store =
newvuex.store
(addnumparameter
(state,payload)}}
);
3.3.3 mutations響應規則
vuex的store中的state是響應式,當state中資料發生變化時vue元件會自動更新,因此mutatons面對state的響應式有需要遵循的規則。
state的變數或者物件等需要初始化完善,當採用非響應式的方式給已定義的變數或物件等新增屬性,該屬性不會進行響應式的渲染在元件中
給state變數或者物件等採用響應式的方式新增刪除屬性使用以下方式:
vue.(state.numobj,『newpara』,100) 新增屬性
vue.delete(state.numobj,『oldpara』) 刪除屬性
mutation中的方法必須是同步操作,若mutatios中定義的方法採用非同步操作,devtool除錯工具無法及時的捕捉與跟蹤該方法處理後資料的響應式狀態。
3.4.1 actions的使用
vuex處理一些非同步操作時會借助action來完成這項任務。
非同步修改資訊
3.5.1 modules的使用
vuex使用單一狀態樹的模式來管理公共資料,但遇到複雜與龐大的資料時,需要採用module把store進行分割為不同的模組,方便對資料進行有層次的管理。
const module1 =
, mutations:
, actions:
, getters:
}const module2 =
, mutations:
, actions:
, getters:
}const store =
newvuex.store
( mutations:
, actions:
, getters:
, modules})
;
vueX基礎知識點筆記
vuex是專門用來管理vue.js應用程式中狀態的乙個外掛程式。他的作用是將應用中的所有狀態都放在一起,集中式來管理。需要宣告的是,這裡所說的狀態指的是vue元件中data裡面的屬性。簡單的來說,它就是儲存公共變數的東西,然後外掛程式可以通過它來訪問,或者修改資料,來達到響應式.相當於乙個倉庫,裡面...
基礎知識點
1 inline block布局 2 table布局 3 justify的末行不對齊 4 兩個圖示之間有空格 換行 5 背景中的的 路徑的 全部斜槓都為 不是 命令列下的這種 doctype html html head meta charset utf 8 title xx title head ...
erlang基礎知識點
1 變數是不可改變的,必須以首字母大寫開頭 2 字串就是小寫字母,或者單引號引起來的字串 3 賦值可以使用匹配模式 4 資料結構有元組,取值用匹配模式來取值 就能取到x,b的值 5 資料結列表 ss,aa,取值是用 head foot 的形式取值 頭和尾的形式匹配 6 字串只能用雙引號表示 7 函式...