1.定义

最后形成这样的结构，system.js为自定义储存的地方

2.需要定义三个地方

1.store/index.js

import Vue from 'vue'
import Vuex from 'vuex'
import getters from './getters'
import system from './modules/system'Vue.use(Vuex)const store = new Vuex.Store({modules: {system},getters
})export default store

2.store/getters.js

const getters = {projectUnit: state => state.system.projectUnit,projectTitleId: state => state.system.projectTitleId,
}
export default getters

3.store/modules/system.js

  const system = {namespaced: true,state: {projectTitleId: "",projectUnit: {},},mutations: {SET_PROJECTTITLEID: (state, projectTitleId) => {state.projectTitleId = projectTitleId},SET_PROJECTUNIT: (state, projectUnit) => {state.projectUnit = projectUnit},}}export default system

3.往里面添加数据

this.$store.commit("system/SET_PROJECTUNIT", this.projectUnit);//在store/modules/system.js里面找到对应的数据
this.$store.commit( "system/SET_PROJECTTITLEID",this.Form.id);

4.取数据

this.$store.getters.projectUnit
this.$store.getters.projectTitleId

vue--如何使用vuex储存数据相关推荐

vue：vue页面刷新vuex数据消失问题
vuex中数据刷新页面消失问题: a页面请求的数据保存在vuex中,只要不刷新,那跳转到b页面里也可以用,但如果b页面刷新,那vuex里的数据就会消失, 可以得解决方法:a页面用的数据a页面的生命周期 ...
【Vue系列】vuex详解，一篇彻底搞懂vuex
目录 1. 理解vuex 1.1 vuex是什么 1.2 什么是状态管理模式 1.3 什么时候用vuex 1.4 vuex工作原理 2. 应用vuex 2.1 安装vuex 2.2 搭建vuex环境 ...
vue状态管理——Vuex
vuex官方解释 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化. 简单理解 vue ...
Vue状态管理vuex
转: https://www.cnblogs.com/xiaohuochai/p/7554127.html 前面的话由于多个状态分散的跨越在许多组件和交互间各个角落,大型应用复杂度也经常逐渐增长.为 ...
vue.js 组件之间传递数据 1
vue.js 组件之间传递数据框架浏览数:437 2017-8-21 组件是 vue.js 最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.如何传递数据 ...
Vue 状态管理 Vuex
1.概述 Vuex作为插件,管理和维护整个项目的组件状态. 2.安装vuex cnpm i --save vuex 3.vuex使用 github地址:https://github.com/MengF ...
vuex构建vue项目_如何使用Vue.js，Vuex，Vuetify和Firebase构建单页应用程序
vuex构建vue项目如何使用Vuetify和Vue路由器安装Vue并构建SPA (How to install Vue and build an SPA using Vuetify and Vue ...
视频教程-德国Vue.js2终极开发教程（含Vue路由和Vuex）-Vue
德国Vue.js2终极开发教程(含Vue路由和Vuex) * Academind GmbH创始人,当前生活在德国慕尼黑 * 从15岁开始进入开发领域,前后端技术均很精通,毕业于慕尼黑大学硕士学位 * ...
德国Vue.js2终极开发教程（含Vue路由和Vuex）-Max-专题视频课程
德国Vue.js2终极开发教程(含Vue路由和Vuex)-808人已学习课程介绍新手入门现代前端开发的不二选择课程目标: * 学会从简单到复杂企业级应用的VueJS程序编写方法 ...

vue--如何使用vuex储存数据

vue--如何使用vuex储存数据

1.定义

2.需要定义三个地方

3.往里面添加数据

4.取数据

vue--如何使用vuex储存数据相关推荐

最新文章

热门文章