Vuex的模組化

2021-10-11 00:18:27 字數 792 閱讀 1816

目錄：

1.在store資料夾下建立modules資料夾，modules資料夾下的index.js用來彙總vuex的模組，並統一暴露。這樣只需在store的配置中引入modules即可。

// 彙總所有vuex的模組


import home from


"./home"


;import login from


"./login"


;// 統一暴露出去


export


default


;
2.modules資料夾下，用來設定每個模組的狀態管理配置。例如：

// home元件的vuex狀態


export


default


, getters:


, actions:


, mutations:,}


;
3.在store的配置檔案引入：

import modules from


"./modules"


;const store =


newvuex.store


()
4.元件中使用：注意點是：如果使用模組化在對映state時，接收使用物件，並且使用函式得到資料值,例如：

import


from


"vuex"


;computed:)}


, methods:


,mounted()

vuex模組化設定

import vue from vue import vuex from vuex vue.use vuex 首先宣告乙個需要全域性維護的狀態 state,比如 我這裡舉例的resturantname const modulesfiles require.context modules false,...

Vuex的模組化 優點

前言 如果說我們的vuex的倉庫 量巨大，我們要不要採用就像後端與一樣的分層，要不然一噸的 放在main裡，呵呵。所以我們要採用模組化！其中我們的store.js被我們封裝成了這樣子 import api from utils api var api new api goods const stat...

vuex的模組化使用

store檔案如下 1.modules下檔案是模組化的劃分，裡面的js有state,action,mutations.然後通過 export default 方式匯出。2.index.js中匯出的格式如下 new vuex.store mutations actions getters 所以inde...