最近做的一个项目中，由于头部导航是接口返回的，而且数据还特别多，所以这里就运用到了Vuex来存储接口返回的数据，这样子接口就只需要调用一次就可以了。

步骤

1、安装Vuex

npm install vuex --save

2、引用Vuex
(1)、创建一个store文件夹，在index.js里引入Vuex
在这里插入图片描述
（2)、在main.js里引入store文件夹

import store from './store'

3、将接口返回的数据存入store里
在这里插入图片描述
4、获取store里的数据（在导航组件里调用store数据）
在这里插入图片描述
大功告成~ 这样子就可以将接口返回的数据存入store里啦

注意昂：用来解决异步流程改变store里的数据的，要在actions里写，因为matution是直接进行同步操作，如果你在mutations里进行异步操作，不会起任何效果，只有通过action=>mutations=>states,这个流程进行操作,数据才会改变哟
Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue