1. 程式人生 > >vue中moudles的作用及使用方法

vue中moudles的作用及使用方法

port 處理請求 裏的 分割 true span 行數據 每一個 incr

1.作用:vuex允許把store分割為模塊,每一個模塊都有自己的state,actions,getters,mutations甚至是嵌套一些子模塊,從上到下進行同樣方式的分割

  在文件src中創建一個文件夾store,包含index.js就是store.js ,然後再創建文件夾modules文件夾,此文件夾中放的就是模塊,

import Vue from ‘vue‘
import Vuex from ‘vuex‘

Vue.use(Vuex)
import menu from ‘./modules/menu‘
export default new Vuex.Store({
  state: {

  },
  mutations: {

  },
  actions: {

  },
  modules:{
    menu
  }
})

const moduleA = {
  state: { count: 0 },
  mutations: {
    increment (state) {
      // 這裏的 `state` 對象是模塊的局部狀態
      state.count++
    }
  },

  getters: {
    doubleCount (state) {
      return state.count * 2
    }
  }
}

2.對數據的處理方式

組件調用數據,逗需要通過action

在actions中進行數據的處理請求等草左,

然後action在把數據調教給mutation,mutation在對state中的數據進行處理

(只有mutation具有資格能夠修改state中的數據,)

3.命名空間

在模塊中添加namesapced:true

添加了以後在哪dispatch和commit的時候木塊名就需要路徑+模塊名

vue中moudles的作用及使用方法