今天我們來討論一下在項目中到底應該怎么使用vuex(vuex還沒有入門的同學可以先看這個鏈接vuex 入門及持久化 - 簡書)。那么什么時候我們需要用vuex呢,為什么要使用vuex呢?
大體思路
vuex大家可以簡單了解成一個訂閱發布模式的實現庫,我們會發出action去修改state,并且state,只能用action去修改不能直接修改(這里的action可以理解成發請求修改)。并且如果頁面用有用到vuex里面的state,state變化頁面會自動重新渲染。那么我們根據這個原理,會發現,當我們有多個頁面共用一個狀態,或者多個模塊公用一個狀態的時候,那么我們就需要用vuex
1、創建vuex模塊
vuex也是可以分模塊的,哪怕我們可能用不到那么多的模塊,最好也是分模塊來寫,畢竟我們不管做什么項目都要抱著一個做大項目的心態去
創建一個store目錄在目錄下創建一個用戶信息模塊(創建一個Account目錄),然后創建mutations.js文件,同步發送改變state的請求,mutation-types命名空間(用不用都行),state.js當前模塊的狀態,然后在index統一導出,我們以登錄后存放用戶信息為例
創建命名空間
創建一個mutation中編寫一個存放用戶信息的方法
編寫state
在Account/index 導出該模塊
在store目錄下創建index,引入vuex,并引入剛才的那幾個模塊,然后在入口文件(main)引入
在項目中使用
在頁面中使用的時候不需要在引入任何文件,直接調用對應的方法即可。
使用
總結
當vuex和vue的組件,可能進行過一些connect的操作,然后在操作vuex的時候,如果vuex的state在vuex的template中使用的話會重新渲染。下期我們討論一下typeScript。vue有些哪些地方想討論的歡迎加QQ: 1205669217討論