vue3+elementplus+ts搭建权限管理系统--7

*****************此文仅用于个人记录学习vite创建vue3项目过程，请勿转载或转发******************

一、登录状态管理

在登录页面没有进行状态管理之前，登录状态标识pm_token存在localStorage中，使用Vuex的话，则将这个状态由Vuex来管理，另外如果是中大型项目的话，可能需要处理不同的模块对应的状态，因为使用模块化进行状态管理。

首先，将登录状态或用户的相关状态使用user模块进行管理，在src/store下创建一个modules文件夹，并在modules文件夹下添加user.js文件，先处理登录标识

• 设置namespace为true，方便日后维护可按模块查找排错
• 在getters中设置派生变量isLogin,表示是否登录，取值为状态中的token字符串的Boolean转换，或者直接取自本地pm_token标识
• 在mutations中定义两个方法，用于设置token值和清除token值，token值是登录成功后后台返回的登录令牌字符串，系统中的请求需要携带该令牌字符串供后台验证身份，所以考虑登录状态管理后，需要修改提交登录的成功处理，修改src/view/login/index.vue的doLogin方法，注释之前localStorage设置的pm_token，改为store调用

然后在入口文件中引入该模块

修改完成后测试登录流程，登录成功后跳转到首页，在开发者工具Application面板的Local Storage中存在登录标识pm_token，说明保存登录状态成功