vuex——重置vuex数据

简介: vuex——重置vuex数据

需求描述

登出系统时,需将 vuex 中存储的数据,恢复为最初的默认状态。

实现方法

通过 replaceState 方法,将最初的 vuex 的 state 数据作为参数传入即可

完整代码范例

src\store\index.js

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

Vue.use(Vuex);

export const store_State_init = {
  isLogin: false,
  token: "",
  userInfo: {},
};

export default new Vuex.Store({
  state: store_State_init,
  mutations: {
    set_userInfo(state, value) {
      state.userInfo = value;
    },
    set_isLogin(state, value) {
      state.isLogin = value;
    },
  },
  actions: {},
  modules: {},
});

src\views\index\index.vue

import { store_State_init } from "@/store";
 
this.$store.replaceState(store_State_init);
目录
相关文章
|
5月前
|
存储
vuex5种状态?
vuex5种状态?
|
5月前
|
JavaScript 开发者
Vue状态管理: 在Vuex中,什么是mutation?它们应该如何使用?
Vue状态管理: 在Vuex中,什么是mutation?它们应该如何使用?
109 4
|
12月前
|
存储 JavaScript
Vue2(状态管理Vuex)
Vue2(状态管理Vuex)
|
2月前
|
存储 JavaScript 开发者
Vuex是如何帮助我们管理状态的
Vuex通过一系列核心概念和规则,帮助我们有效地管理和维护Vue.js应用程序中的状态。
14 4
|
5月前
|
存储 JavaScript 前端开发
vuex的5种状态
vuex的5种状态
26 0
|
5月前
|
JavaScript
Vue状态管理:什么是getters?Vuex中的getters有什么作用?
Vue状态管理:什么是getters?Vuex中的getters有什么作用?
141 3
|
5月前
|
JavaScript
Vue状态管理:如何在Vue组件中访问Vuex的状态?
Vue状态管理:如何在Vue组件中访问Vuex的状态?
64 3
|
5月前
Vuex各种状态的使用
Vuex各种状态的使用
|
10月前
Vuex->vuex获取值以及改变值,vuex异步请求
Vuex->vuex获取值以及改变值,vuex异步请求
45 0
|
缓存 JavaScript
Vue Vuex 更新页面 Store 数据丢失
Vue Vuex 更新页面 Store 数据丢失
112 0