【Vue 功能总结】Vue 登录功能实现：从校验到 Token 存储

目录

前言：

一、功能需求分析

1. 核心功能

2. 技术选型

二、表单校验实现

1. 基础校验规则

2. 自定义校验方法

三、登录请求与 Token 存储

1. 封装登录 API

2. 提交登录请求

四、Token 存储与使用

1. 存储 Token

2. 全局请求拦截器

3. 路由守卫

五、完整代码示例

六、总结与优化

1. 关键点

2. 扩展优化

前言：

在前端开发中，登录功能是用户认证的核心模块。一个完整的登录功能，包括表单校验、登录请求、Token 存储等关键步骤。
 

一、功能需求分析

1. 核心功能

• 用户输入登录信息（用户名/邮箱、密码）。
• 表单校验（必填项、格式等）。
• 提交登录请求到后端 API。
• 处理成功响应（存储 Token）。
• 处理失败响应（显示错误提示）。

2. 技术选型

• Vue 3（Composition API）。
• Element Plus / Ant Desig