vuex初探(四)

前言:上一章我們將倉庫拆分成了四個文件闯捎,這一章我們講下mapStatemapActions這兩個輔助函數(shù)叙谨。
GitHub:https://github.com/Ewall1106/mall

1温鸽、關(guān)于輔助函數(shù)

(1)首先我們需要明確一點(diǎn)的就是,像mapState這些都是輔助函數(shù)手负,只不過是一種簡寫方法涤垫,讓你少按幾次鍵而已。以mapState輔助函數(shù)為例:

當(dāng)一個組件需要獲取多個狀態(tài)時候虫溜,將這些狀態(tài)都聲明為計(jì)算屬性會有些重復(fù)和冗余。為了解決這個問題股缸,我們可以使用mapState輔助函數(shù)幫助我們生成計(jì)算屬性衡楞,讓你少按幾次鍵。

(2)注意事項(xiàng)

  • mapMutations放到methods下敦姻;
  • mapActions放到methods下瘾境;
  • mapGetters則放到computed下。

2镰惦、mapState

(1)讓我們進(jìn)入test.vue文件中迷守,我們以前獲取vuexstatecity數(shù)據(jù)直接使用的是:

this.$store.state.city

但是,如果要引用state中的很多數(shù)據(jù)怎么辦旺入?

(2)這時候兑凿,就是mapState這個輔助函數(shù)派上用場了凯力,可以幫我們簡化操作。

  • 首先當(dāng)然得從vuex中引入mapState礼华;
  • 然后我們在computed計(jì)算屬性中使用這個輔助函數(shù)咐鹤。
mapState輔助函數(shù)

3、mapActions

(1)mapState輔助函數(shù)是獲取vuexstate對象的值圣絮,而mapActions對應(yīng)的是哪個操作呢祈惶?——就是把dispatch方法分發(fā)action這個操作簡化。(這里不懂的可以看前章:vuex初探(二)

(2)所以扮匠,讓我們進(jìn)入到testCity.vue頁面:

  • 引入mapActions
  • methods中注冊這個方法
  • 使用
mapState輔助函數(shù)

4捧请、小結(jié)

  • 這章講了vuex中的兩個輔助函數(shù),其實(shí)沒什么難的棒搜,其本質(zhì)不過就是簡化代碼而已疹蛉。
  • 下章我們講mapMutationsmapGetters這兩個輔助函數(shù),雖然本質(zhì)都是一樣同為簡化操作帮非,但是使用的過程中與本章講的兩個還是有些許不同氧吐。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市末盔,隨后出現(xiàn)的幾起案子筑舅,更是在濱河造成了極大的恐慌,老刑警劉巖陨舱,帶你破解...
    沈念sama閱讀 219,188評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件翠拣,死亡現(xiàn)場離奇詭異,居然都是意外死亡游盲,警方通過查閱死者的電腦和手機(jī)跟狱,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,464評論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來耕陷,“玉大人字旭,你說我怎么就攤上這事≥罕迹” “怎么了欣范?”我有些...
    開封第一講書人閱讀 165,562評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長令哟。 經(jīng)常有香客問我恼琼,道長,這世上最難降的妖魔是什么屏富? 我笑而不...
    開封第一講書人閱讀 58,893評論 1 295
  • 正文 為了忘掉前任晴竞,我火速辦了婚禮,結(jié)果婚禮上狠半,老公的妹妹穿的比我還像新娘噩死。我一直安慰自己颤难,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,917評論 6 392
  • 文/花漫 我一把揭開白布甜滨。 她就那樣靜靜地躺著乐严,像睡著了一般。 火紅的嫁衣襯著肌膚如雪衣摩。 梳的紋絲不亂的頭發(fā)上昂验,一...
    開封第一講書人閱讀 51,708評論 1 305
  • 那天,我揣著相機(jī)與錄音艾扮,去河邊找鬼既琴。 笑死,一個胖子當(dāng)著我的面吹牛泡嘴,可吹牛的內(nèi)容都是我干的甫恩。 我是一名探鬼主播,決...
    沈念sama閱讀 40,430評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼酌予,長吁一口氣:“原來是場噩夢啊……” “哼磺箕!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起抛虫,我...
    開封第一講書人閱讀 39,342評論 0 276
  • 序言:老撾萬榮一對情侶失蹤松靡,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后建椰,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體雕欺,經(jīng)...
    沈念sama閱讀 45,801評論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,976評論 3 337
  • 正文 我和宋清朗相戀三年棉姐,在試婚紗的時候發(fā)現(xiàn)自己被綠了屠列。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,115評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡伞矩,死狀恐怖笛洛,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情乃坤,我是刑警寧澤苛让,帶...
    沈念sama閱讀 35,804評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站侥袜,受9級特大地震影響蝌诡,放射性物質(zhì)發(fā)生泄漏溉贿。R本人自食惡果不足惜枫吧,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,458評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望宇色。 院中可真熱鬧九杂,春花似錦颁湖、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,008評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至镀层,卻和暖如春镰禾,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背唱逢。 一陣腳步聲響...
    開封第一講書人閱讀 33,135評論 1 272
  • 我被黑心中介騙來泰國打工吴侦, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人坞古。 一個月前我還...
    沈念sama閱讀 48,365評論 3 373
  • 正文 我出身青樓备韧,卻偏偏與公主長得像,于是被迫代替她去往敵國和親痪枫。 傳聞我的和親對象是個殘疾皇子织堂,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,055評論 2 355

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