前言:如果说我们的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. 【省选十连测之九】【DP】【组合计数去重】【欧拉函数】基本题

    目录 题意: 输入格式: 输出格式: 数据范围: 思路: 嵌套题的转移 基本题的转移 Part1 Part2 Part3 代码 题意: 这是一个关于括号组合的题. 首先定义一道题是由'(',')',' ...

  2. BZOJ.4137.[FJOI2015]火星商店问题(线段树分治 可持久化Trie)

    BZOJ 洛谷 一直觉得自己非常zz呢.现在看来是真的=-= 注意题意描述有点问题,可以看BZOJ/洛谷讨论. 每个询问有两个限制区间,一是时间限制\([t-d+1,t]\),二是物品限制\([L,R ...

  3. 把H5打包成IOS APP其实可以很简单!签名?越狱?都不需要!

    很多小伙伴都在开发自己的app, 有的实现实现比较简单,就是一个h5页面,然后想要打包成app发布出去. 这个想法很单纯 打包生成个app这个是很简单的,网上一堆打包工具,分分钟可以完成 BUT…… ...

  4. mysql5.7.X版本only_full_group_by问题解决

    一.出错原因 最近因为开发数据库与部署数据库版本不同,带来了几个问题,其中only_full_group_by问题是之前没有遇到的. 具体报错如下 [Err] 1055 - Expression #1 ...

  5. console.log

    其实,console.log 不仅仅有一下应用 console.log() 这个应该是最常用的 console.error() 输出错误信息 会以红色显示 console.assert(bool,”i ...

  6. xshell登陆服务器步骤

    Xshell远程连接服务器 打开xshell后找到左上角第一个“文件”点击,弹出来一个下拉框,选择“新建”点击(或者直接按下快捷键“Alt+n”).         点击“新建”之后就会出现下面这样一 ...

  7. 关于gulp-sftp上传到服务器

    首先下载npm模块 npm install --save-dev gulp gulp-sftp webpack del gulp-sftp 上传服务器主要依赖 gulp.webpack必备 del 是 ...

  8. matlab安装 macos

    http://pan.baidu.com/s/1o6qKdxo内附安装说明Matlab R2014A Mac & Linux 破解版 readme文件有流程!可以安装

  9. vue font-icon 图标

    1.vue 游览器左上角小图标 把.ico文件放在根目录下的static文件夹下,然后link标签引入 <link rel="shortcut icon" href=&quo ...

  10. Java和js操作json

    Js中 Json字符串转json对象 //将json格式的字符串转为json对象 var t = JSON.parse('{"name":123}'); alert(t.name) ...