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

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

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

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

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的哪个对象。就是我们的唯一标识。

Vuex的模块化、优点的更多相关文章

  1. 074——VUE中vuex之模块化modules开发实例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. vuex的模块化使用

    store文件如下 1.modules下文件是模块化的划分,里面的js有state,action,mutations.然后通过 export default { namespaced: true, s ...

  3. Vue学习之--------深入理解Vuex之模块化编码(2022/9/4)

    在以下文章的基础上 1.深入理解Vuex.原理详解.实战应用:https://blog.csdn.net/weixin_43304253/article/details/126651368 2.深入理 ...

  4. vuex数据管理-数据模块化

    对于vue这类mvvm框架来说,其核心就是组件与数据,因此做好相应的数据管理极为重要.这里分享下vuex数据模块化管理的方法,有利于搭建便于维护.协作的vue项目. vuex管理基本方法和使用 模块化 ...

  5. 一道面试题 vuex缺点?

    最近去面试的时候,面试官有一道题是让我阐述用vuex的优缺点,优点倒还好说,这个缺点还真没有认识到,有道友可以帮忙解惑嘛? 2 回答 慕标5265247 这种问题一般都有通用回答套路.一件挺好的东西, ...

  6. 前端MVC Vue2学习总结(九)——Vuex状态管理插件

    一.概要 1.1.Vuex定义与注意事项 Vuex是为vue.js框架更好的管理状态而设计一个插件.Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的 ...

  7. Vuex的一个易错点

    好长时间不用Vuex,发现有些东西记模糊了. 在对Vuex进行模块化开发的时候, const store = new Vuex.Store({ modules: { a: moduleA, b: mo ...

  8. vuex的实现

    源代码可以查看我的github:  https://github.com/Jasonwang911/TryHardEveryDay/tree/master/Vuex/vuex-resouce  欢迎s ...

  9. 踩坑记录-nuxt引入vuex报错store/index.js should export a method that returns a Vuex instance.

    错误 store/index.js代码如下: import Vue from 'vue'; import Vuex from 'vuex'; import city from './moudle/ci ...

随机推荐

  1. gulp 粗粗学习 记录下

    看视频学习 粗粗记录下 以便以后学习 1.初记录 gulp.task //定义一个任务 gulp.src //锁定到做task任务的文件路径 gulp.dest //锁定到任务做完后文件去向的路径 g ...

  2. 推荐一款免费的PDF转换工具 | PDFCandy

    相信大家在用的PDF转换工具也很多,下面良心推荐这款软件(PDFCandy)给大家,方便在今后的工作中进行运用.提高大家的工作效率. PDFCandy分为两种:网页端和客户端.(根据大家的喜好度来进行 ...

  3. 基于TensorFlow的手写中文识别(版本一)

    具体效果实现: 第一次由于设备问题所以只训练了是一些个简单的字: 第二选了23个字训练了3000在字迹清晰下能够识别: 类似于默,鼠,鼓,这类文字也能识别,由于训练数据的问题,在测试的时候应尽量写在正 ...

  4. Android- APP 秒开

    Android- APP 秒开 1. 启动APP 时白屏或者黑屏 现象:当启动APP 时,会有一个白屏或者黑屏一闪而过,然后才会显示出主界面. 这是因为,我们新打开一个应用,系统会为这个应用创建一个进 ...

  5. Numpy 基础运算2

    # -*- encoding:utf-8 -*- # Copyright (c) 2015 Shiye Inc. # All rights reserved. # # Author: ldq < ...

  6. 编程菜鸟的日记-初学尝试编程-C++ Primer Plus 第6章编程练习5

    #include <iostream> using namespace std; const double N1=35000; const int N2=15000; const int ...

  7. Linux下Shell重定向

    1. 标准输入,标准输出与标准错误输出 Linux下系统打开3个文件,标准输入,标准输出,标准错误输出. 标准输入:从键盘输入数据,即从键盘读入数据. 标准输出:把数据输出到终端上. 标准错误输出:把 ...

  8. PHP生成图表pChart

    pChart是一个开源的图表生成库,主要涉及3个Class:pChart.class, pData.class, pCache.class,可生成20多种简单或复杂的图表,支持PNG,JPG,GIF通 ...

  9. hadoop2-elasticsearch的安装

    本文主要讲elasticsearch-2.2.1的安装过程. 准备工作: 1.搭建虚拟机 你需要先参考 hadoop2集群环境搭建 把你的虚拟机搭建起来-hadoop环境可以先不用搭建(完成步骤1到步 ...

  10. IE控件cab包手动安装

    一.XP系统 第1步:先解压cab包,在解压的文件中找到*.inf文件,然后右击,选择安装,此时会把解压文件拷到C:Windows\System32文件夹下.第2步:注册拷到上述文件夹下的ocx文件. ...