Vuex的模块化、优点

前言：如果说我们的vuex的仓库代码量巨大，我们要不要采用就像后端与一样的分层，要不然一吨的代码放在main里，呵呵。所以我们要采用模块化！

看这篇文章的时候，一定要看看上一篇的vuex入门精讲：Vuex的基本概念、项目搭建、入坑点

其中我们的store.js被我们封装成了这样子：

 

+ View Code?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

import API from '../../utils/api'; var api = new API('goods');   const state = {     products: [] } const mutations={ } const actions={ } const getters={ } export default{     state,mutations,actions,getters }

Store.js

+ View Code?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

import Vue from 'vue' import Vuex from 'vuex' import User from './mudules/user' import Product from './mudules/product'   Vue.use(Vuex);   //仓库 const store = new Vuex.Store({     modules:{         User,Product     } }) export default store;

　这样我们的仓库就不在像汽车站一样了。

其中需要注意的是;在获取store仓库里的state中，我们需要 

return this.$store.state.User.user;这种方式。也就说我们import的哪个对象。就是我们的唯一标识。