教你使用vuex快速上手

快速在項目中使用vuex

項目源代碼在文章結尾

我的總結,有出錯的地方還望大神指出

這只是如何去快速的使用它,你若想真正的去了解去學習那就到 官網 好好的看一看

vuex的目錄結構

圖片描述

state

項目中想要管理的數據和狀態都在這了,「Vuex 使用 單一狀態樹 —— 是的,用一個對象就包含了所有的應用層級狀態」,這就是爲何要用vuex的緣由

圖片描述

types

鏈接actions和mutations的橋樑

圖片描述

actions

你能夠粗略的理解爲這就是事件方法函數,列出你想要作的事件
要注意:它提交的是mutation,不作數據和狀態的更改,這些操做在mutations中處理
簡單說就是中轉一下,我在這裏列出來我想幹嗎(作計劃),而後在mutations中去執行(實施計劃)vue

這裏的手動觸發是指手動觸發操做actions,而後actions會去自動觸發操做mutations以獲取值

圖片描述

mutations

這是你實施計劃的地方,也是惟一的
處理數據,操做狀態,獲取數據都在這裏了

圖片描述

getters

和state相對應,傳遞state中的數據

圖片描述

更加詳細的說明都在註釋裏面了,看着註釋去理解代碼

項目地址git

相關文章
相關標籤/搜索