调用API接口登录后，获取用户信息保存到Vuex中并渲染到Vue页面

文件封装

步骤

1. 核心请求文件

2. 在 apiUse 文件夹中的 index.js 文件写 API接口方法

• baseURL + url 后台完整地址

3. 将信息写入 store 文件夹中的 index.js 文件
   将信息保存到Vuex中，Vuex管理全局共享的数据

①引入接口方法

② state 变量中定义要接收的对象

③ mutations 方法更新信息

④ actions 方法请求用户信息保存到 state变量 里userInfo中

⑤ getters 方法定义并导出用户信息

4. 在 router 文件夹中的 index.js 文件中进行 路由守卫

引入 import store from '@/store'

beforeEach 页面发送跳转就走一次，在函数中判断是否已登录 (token) 并获取用户信息=>store.dispatch(‘getUserInfoActions’)

5. 渲染页面

template 中渲染用户信息

script 中引入 mapGetters

最后在 computed 计算属性中使用