一、登录+注册页面逻辑
- 写样式布局:垂直居中、编程式路由、调后端接口
- 正则表达式验证用户输入的密码规则
- 校验通过后,跳转页面
- js兜底校验调后端接口
- 将token值存储到vuex中,实现持久化存储
- vuex不是持久化存储的,如果需要持久化存储需要加入插件
- 如果不做持久化插件,刷新后token值会失效
二、基于elenment-plus的组件封装
2.1场景:后台管理系统中用到了大量的表单
- 登录、注册、更改密码、内涝展示事件
- 数据驱动设计表单
- 数据分为
- 数据层+业务层+样式层
- 结构设计上:
- 通过template+v-if对表单的结构进行修改
- 数据分为
三、退出登录
- 核心思路:退出登录就是清除vuex和本地所有缓存的值,然后页面强制切换到登录页面
参考课程:项目_17_布局_获取用户信息_哔哩哔哩_bilibili