vuex簡介

Vuex 是一個專為 Vue.js 應(yīng)用程序開發(fā)的狀態(tài)管理模式沐旨。它采用集中式存儲管理應(yīng)用的所有組件的狀態(tài)森逮,并以相應(yīng)的規(guī)則保證狀態(tài)以一種可預(yù)測的方式發(fā)生變化。簡單的來說磁携,就是數(shù)據(jù)共用褒侧,對數(shù)據(jù)集中起來進行統(tǒng)一的管理

核心概念主要有這些:

State
Vuex 使用單一狀態(tài)樹——是的,用一個對象就包含了全部的應(yīng)用層級狀態(tài),將所需要的數(shù)據(jù)寫放這里闷供,類似于data烟央。
Getter
有時候我們需要從 store 中的 state 中派生出一些狀態(tài),使用Getter这吻,類似于computed吊档。
Mutation
更改 Vuex 的 store 中的狀態(tài)的唯一方法,類似methods唾糯。
Action
Action 提交的是 mutation怠硼,而不是直接變更狀態(tài),可以包含任意異步操作移怯,這里主要是操作異步操作的香璃,使用起來幾乎和mutations方法一模一樣,類似methods。
Module
當(dāng)應(yīng)用變得非常復(fù)雜時舟误,store 對象就有可能變得相當(dāng)臃腫葡秒。Vuex 允許我們將 store 分割成模塊(module)。每個模塊擁有自己的 state嵌溢、mutation眯牧、action、getter赖草、甚至是嵌套子模塊学少。

vuex中mutation為什么是同步?
原因: 使用devtools調(diào)試的時候會有問題秧骑。
一條重要的原則就是要記住 mutation 必須是同步函數(shù)版确。為什么?請參考下面的例子:

mutations: {
  someMutation (state) {
    api.callAsyncMethod(() => {
      state.count++
    })
  }
}

現(xiàn)在想象乎折,我們正在 debug 一個 app 并且觀察 devtool 中的 mutation 日志绒疗。每一條 mutation 被記錄,devtools 都需要捕捉到前一狀態(tài)和后一狀態(tài)的快照骂澄。然而吓蘑,在上面的例子中 mutation 中的異步函數(shù)中的回調(diào)讓這不可能完成:因為當(dāng) mutation 觸發(fā)的時候,回調(diào)函數(shù)還沒有被調(diào)用坟冲,devtools 不知道什么時候回調(diào)函數(shù)實際上被調(diào)用——實質(zhì)上任何在回調(diào)函數(shù)中進行的狀態(tài)的改變都是不可追蹤的士修。

摘自vuex官網(wǎng):
https://vuex.vuejs.org/zh/guide/mutations.html

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市樱衷,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌酒唉,老刑警劉巖矩桂,帶你破解...
    沈念sama閱讀 218,386評論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡侄榴,警方通過查閱死者的電腦和手機雹锣,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,142評論 3 394
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來癞蚕,“玉大人蕊爵,你說我怎么就攤上這事¤肷剑” “怎么了攒射?”我有些...
    開封第一講書人閱讀 164,704評論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長恒水。 經(jīng)常有香客問我会放,道長,這世上最難降的妖魔是什么钉凌? 我笑而不...
    開封第一講書人閱讀 58,702評論 1 294
  • 正文 為了忘掉前任咧最,我火速辦了婚禮,結(jié)果婚禮上御雕,老公的妹妹穿的比我還像新娘矢沿。我一直安慰自己,他們只是感情好酸纲,可當(dāng)我...
    茶點故事閱讀 67,716評論 6 392
  • 文/花漫 我一把揭開白布捣鲸。 她就那樣靜靜地躺著,像睡著了一般福青。 火紅的嫁衣襯著肌膚如雪摄狱。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,573評論 1 305
  • 那天无午,我揣著相機與錄音媒役,去河邊找鬼。 笑死宪迟,一個胖子當(dāng)著我的面吹牛酣衷,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播次泽,決...
    沈念sama閱讀 40,314評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼穿仪,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了意荤?” 一聲冷哼從身側(cè)響起啊片,我...
    開封第一講書人閱讀 39,230評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎玖像,沒想到半個月后紫谷,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,680評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,873評論 3 336
  • 正文 我和宋清朗相戀三年笤昨,在試婚紗的時候發(fā)現(xiàn)自己被綠了祖驱。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,991評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡瞒窒,死狀恐怖捺僻,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情崇裁,我是刑警寧澤匕坯,帶...
    沈念sama閱讀 35,706評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站寇壳,受9級特大地震影響醒颖,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜壳炎,卻給世界環(huán)境...
    茶點故事閱讀 41,329評論 3 330
  • 文/蒙蒙 一泞歉、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧匿辩,春花似錦腰耙、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,910評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至稼病,卻和暖如春选侨,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背然走。 一陣腳步聲響...
    開封第一講書人閱讀 33,038評論 1 270
  • 我被黑心中介騙來泰國打工援制, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人芍瑞。 一個月前我還...
    沈念sama閱讀 48,158評論 3 370
  • 正文 我出身青樓晨仑,卻偏偏與公主長得像,于是被迫代替她去往敵國和親拆檬。 傳聞我的和親對象是個殘疾皇子洪己,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,941評論 2 355

推薦閱讀更多精彩內(nèi)容

  • Vuex是什么? Vuex 是一個專為 Vue.js應(yīng)用程序開發(fā)的狀態(tài)管理模式竟贯。它采用集中式存儲管理應(yīng)用的所有組件...
    蕭玄辭閱讀 3,118評論 0 6
  • Vuex 是一個專為 Vue.js 應(yīng)用程序開發(fā)的狀態(tài)管理模式答捕。它采用集中式存儲管理應(yīng)用的所有組件的狀態(tài),并以相應(yīng)...
    白水螺絲閱讀 4,667評論 7 61
  • Vuex 是什么屑那? Vuex 是一個專為 Vue.js 應(yīng)用程序開發(fā)的狀態(tài)管理模式拱镐。它采用集中式存儲管理應(yīng)用的所有...
    skycolor閱讀 837評論 0 1
  • State 單一狀態(tài)樹 Vuex 使用單一狀態(tài)樹——是的晌缘,用一個對象就包含了全部的應(yīng)用層級狀態(tài)。至此它便作為一個“...
    peng凱閱讀 696評論 2 0
  • 《怪誕行為學(xué)》一書中的實驗結(jié)果顯示选酗,我們所有人的決策過程不如傳統(tǒng)經(jīng)濟學(xué)理論所假定的那么理性阵难。我們的非理性行為既...
    eebd4933252b閱讀 219評論 0 0