亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

Vue經(jīng)驗總結(jié)

FrancisSoung / 1677人閱讀

摘要：題記前段時間時隔個月重新拾起了，的太好用了。一初體驗以前用慣了的然后突然切換到的真的有點不習(xí)慣。可以包含任意異步操作。至于剩下的目前好像還沒有怎么用到，就下次用了體驗了過后再說吧。

題記：前段時間時隔8個月重新拾起了vue，vue的太（yi）好（jing）用（wang）了（wan）。

一、Vuex初體驗

以前用慣了react的dva然后突然切換到vue的vuex真的有點不習(xí)慣。

1、Store

這個是vuex中的大哥大，什么都?xì)w它管（state、mutations、getter、action、module），你可以把它理解為一個倉庫（官方文檔也是這么說的）

// 創(chuàng)建stroe
const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment (state) {
      state.count++
    }
  }
})
2、State

每個Stroe中都會有這么一個狀態(tài)樹、對于vue來說他是全局的，對于store來說他是唯一的，我們可以把它理解為倉庫中的貨物，當(dāng)客戶（vue）中想要取出倉庫（store）中的貨物（state），很簡單this.$stroe.state.test

3、Mutation

mutation 必須是同步函數(shù)
更改 Vuex 的 store 中的狀態(tài)的唯一方法是提交 mutation。這個我們可以把它比喻為一個訂單（Mutation），當(dāng)客戶（vue）需要改變倉庫（store）中的貨物（state）時，我們就可以通過這個方法去改變，但是這個方法在本地是不能被直接調(diào)用的，你需要以相應(yīng)的 type 調(diào)用 store.commit 方法：

// 無參數(shù)提交
store.commit("increment")
// 有參數(shù)
store.commit("increment", {
  amount: 10
})
// OR
store.commit({
  type: "increment",
  amount: 10
})

其實這一點和dva有點相似

4、Action

這個和Mutation和相似，但是：

Action 提交的是 mutation，而不是直接變更狀態(tài)。

Action 可以包含任意異步操作。

而且actions是與Mutation的觸發(fā)方法也不同，它是用的store.dispatch(確認(rèn)過眼神)，而且它可以調(diào)用actions，講道理它是比mutation高一個等級的。

至于剩下的Getter、Module目前好像還沒有怎么用到，就下次用了體驗了過后再說吧。

二、Vuex中的輔助函數(shù)

在vuex中所有的輔助函數(shù)都只有一個目的，方便你我他

1、mapState

當(dāng)我們需要在一個頁面中獲取store中的多個狀態(tài)時，怎么辦

// bad
this.$store.state.a
this.$store.state.b
this.$store.state.c
// good
computed:{
    ...mapState({
        a:state=>state.a,
        b:state=>state.b,
        c:state=>state.c
    })
}

但是這個地方有一個坑，如果a是一個對象

a:{
    d:1,
    e:{
        f:2
    }
}
computed:{
    ...mapState({
        f:state=>state.a.e.f
    })
}

這樣是不行的，具體為什么我也不是很清楚，求大佬講解

未完待續(xù)...

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/97491.html

相關(guān)文章

  • 2019前端秋季社招面試經(jīng)歷總結(jié)（三年經(jīng)驗）

    摘要：經(jīng)歷月份開放的簡歷，收到了蠻多詢問和面試，算是招人旺季，需要跳槽的小伙伴抓住機(jī)會?，F(xiàn)在是面試了家公司左右，有些高頻問題會標(biāo)記次數(shù)總次數(shù)，可供大家參考。最后祝大家面試順利，拿到心儀的，寫錯的地方請不吝賜教，謝謝。 經(jīng)歷 7月份開放的簡歷，收到了蠻多詢問和面試，算是招人旺季，需要跳槽的小伙伴抓住機(jī)會。一開始廣泛看面試題，沒抓住重點復(fù)習(xí)，有很多平時也沒怎么用到，導(dǎo)致一開始面試的時候，問的問題...

    Kross 評論0 收藏0

  • 2019前端秋季社招面試經(jīng)歷總結(jié)（三年經(jīng)驗）

    摘要：經(jīng)歷月份開放的簡歷，收到了蠻多詢問和面試，算是招人旺季，需要跳槽的小伙伴抓住機(jī)會?，F(xiàn)在是面試了家公司左右，有些高頻問題會標(biāo)記次數(shù)總次數(shù)，可供大家參考。最后祝大家面試順利，拿到心儀的，寫錯的地方請不吝賜教，謝謝。 經(jīng)歷 7月份開放的簡歷，收到了蠻多詢問和面試，算是招人旺季，需要跳槽的小伙伴抓住機(jī)會。一開始廣泛看面試題，沒抓住重點復(fù)習(xí)，有很多平時也沒怎么用到，導(dǎo)致一開始面試的時候，問的問題...

    DevWiki 評論0 收藏0

  • 2019前端秋季社招面試經(jīng)歷總結(jié)（三年經(jīng)驗）

    摘要：經(jīng)歷月份開放的簡歷，收到了蠻多詢問和面試，算是招人旺季，需要跳槽的小伙伴抓住機(jī)會?，F(xiàn)在是面試了家公司左右，有些高頻問題會標(biāo)記次數(shù)總次數(shù)，可供大家參考。最后祝大家面試順利，拿到心儀的，寫錯的地方請不吝賜教，謝謝。 經(jīng)歷 7月份開放的簡歷，收到了蠻多詢問和面試，算是招人旺季，需要跳槽的小伙伴抓住機(jī)會。一開始廣泛看面試題，沒抓住重點復(fù)習(xí)，有很多平時也沒怎么用到，導(dǎo)致一開始面試的時候，問的問題...

    solocoder 評論0 收藏0

  • 項目經(jīng)驗總結(jié)

    摘要：項目中前端開發(fā)問題經(jīng)驗總結(jié)下的安全限制問題問題描述數(shù)據(jù)看板中的數(shù)據(jù)大部分都是實時數(shù)據(jù)或前一天統(tǒng)計的歷史數(shù)據(jù)，因此這邊后端考慮采用來實時和定時推送數(shù)據(jù)來保證數(shù)據(jù)的實時性和有效性。 項目中前端開發(fā)問題經(jīng)驗總結(jié) ie下websocket的安全限制問題 問題描述：數(shù)據(jù)看板中的數(shù)據(jù)大部分都是實時數(shù)據(jù)或前一天統(tǒng)計的歷史數(shù)據(jù)，因此這邊后端考慮采用websocket來實時和定時推送數(shù)據(jù)來保證數(shù)據(jù)的實時...

    William_Sang 評論0 收藏0

  • Python面試經(jīng)驗總結(jié)，面試一時爽，一直面試一直爽！

    摘要：面試的心得體會簡歷制作我做了兩份簡歷，用兩個手機(jī)賬號，兩個簡歷名字，分別在各個招聘網(wǎng)站投了雙份簡歷，一個是數(shù)據(jù)分析的簡歷一個是全棧開發(fā)的簡歷，我真正接觸快年，不管是學(xué)習(xí)還是工作學(xué)到的東西，這兩年大概掌握了前端爬蟲數(shù)據(jù)分析機(jī)器學(xué)習(xí)技術(shù)， showImg(https://upload-images.jianshu.io/upload_images/13090773-b96aac7e974c...

    gxyz 評論0 收藏0

發(fā)表評論

0條評論

FrancisSoung

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<