标签:清空 程序开发 action 调用 简单介绍 开发 同步 设置 rod
首先简单了解一下什么是Vuex?
Vuex是一个专为Vue.js应用程序开发的状态管理模式。采用集中式存储来管理应用所有组件的状态。
以下是对vuex的使用的简单介绍:
一、安装
npm i vuex -S 安装Vuex
二、创建仓库,目录:/src/store/store.js
三、在main.js全局配置文件内引入Vuex
// main.js import Vue from "vue"; import App from "./App"; import router from "./router"; import { store } from "./store/store"; // 引入仓库 Vue.config.productionTip = false; /* eslint-disable no-new */ new Vue({ el: "#app", router, store, components: { App }, template: "<App/>" });
四、auth.js,将数据存在cookies
import Cookies from "js-cookie";
export function getUserinfo() {
return Cookies.get("userinfo");
}
export function setUserinfo(userinfo) {
return Cookies.set("userinfo", userinfo);
}
这样一套完整的Vuex就已经成型了,接下来就是调用和设置
五、设置state
// 同步,调用store中mutations
this.$store.commit(‘SET_USERINFO‘,{name:‘ZhangSan‘})
// 异步,调用store中actions
this.$store.dispatch(‘setUserinfo‘,{name:‘LiSi‘})
六、获取state
this.$store.getters.userInfo
标签:清空 程序开发 action 调用 简单介绍 开发 同步 设置 rod
原文地址:https://www.cnblogs.com/jing-zhe/p/11839308.html