码迷,mamicode.com
首页 > 其他好文 > 详细

Vue + Element UI 实现权限管理系统 前端篇(八):管理应用状态

时间:2020-08-02 23:36:22      阅读:93      评论:0      收藏:0      [点我收藏+]

标签:功能   element   cli   同步   module   配置   nbsp   port   菜单   

使用Vuex管理应用状态

1.引入背景

如之前 导航菜单收缩和展开功能,组件封装后,状态分开了。

现在需要一个共享组件来做数据同步状态,

Vuex 很好的解决了这个需求(ps:有句话叫不要专门为了 Vuex 而用 Vuex - - 慢慢品了只能0 0)

技术图片

 

 

 2.安装

https://vuex.vuejs.org/zh/installation.html

官网最简洁了

我是 cli 装的时候自带了帮我装好了- -

3.添加配置

import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
      collapse: false   // 导航栏收缩状态
  },
  mutations: {
      collapse(state) { // 改变收缩状态
          state.collapse = !state.collapse;
      }
  },
  actions: {},
  modules: {}
});

 

 

4.使用 Store

 

Vue + Element UI 实现权限管理系统 前端篇(八):管理应用状态

标签:功能   element   cli   同步   module   配置   nbsp   port   菜单   

原文地址:https://www.cnblogs.com/CZheng7/p/13423485.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!