vueJavaScriptalready

利用Vuex+vue搭建一个自登陆的系统框架

2022-09-17  本文已影响0人  扶得一人醉如苏沐晨

需求:

用户第一次进入系统,打开弹窗,输入用户账号密码登陆成功后,后面再次打开系统,用户无需登陆,且只要系统不关闭,token无限续期

步骤一,封装工具类

src目录下面新建一个util文件夹

1、先封装一个校验是否为空的工具类

util --> validate.js

2、封装浏览器存储(session和local)工具类

util --> store.js

3、封装axios

新建一个erroCode.js文件const-->errorCode.js

新建一个axios.js文件


4、封装登陆用到的接口

 新建一个api文件夹,新建一个login.js文件

5、封装vuex使用方法

 在store文件夹下面新建一个module文件夹,在module下面新建一个user.js用于封装用户功能模块

 在store文件夹下面新建一个getter.js文件

在store文件夹下面的index.js文件引入

ok一切前置工作完成

新建以下文件(index是home主页面,dialog是配置账户密码的弹窗)

 index.vue下面

Dialog.vue页面

上一篇 下一篇

猜你喜欢

热点阅读