52 lines
1.5 KiB
Markdown
52 lines
1.5 KiB
Markdown
|
# 修复Login函数导出问题
|
|||
|
|
|
|||
|
|
## 1. 问题分析
|
|||
|
|
- **错误信息**：`SyntaxError: The requested module '/src/services/api.ts' does not provide an export named 'login'`
|
|||
|
|
- **原因**：`api.ts` 文件中缺少 `login` 函数的导出
|
|||
|
|
- **影响**：登录功能无法正常工作
|
|||
|
|
|
|||
|
|
## 2. 解决方案
|
|||
|
|
|
|||
|
|
### 2.1 修复 `api.ts` 文件
|
|||
|
|
在 `api.ts` 文件末尾添加 `login` 函数，确保它被正确导出：
|
|||
|
|
|
|||
|
|
```typescript
|
|||
|
|
// 登录API
|
|||
|
|
export const login = async (credentials: LoginRequest): Promise<LoginResponse> => {
|
|||
|
|
try {
|
|||
|
|
const response = await fetch(`${API_BASE}/admin/login`, {
|
|||
|
|
method: 'POST',
|
|||
|
|
headers: {
|
|||
|
|
'Content-Type': 'application/json',
|
|||
|
|
},
|
|||
|
|
body: JSON.stringify(credentials),
|
|||
|
|
})
|
|||
|
|
if (!response.ok) {
|
|||
|
|
const errorData = await response.json()
|
|||
|
|
throw new Error(errorData.error || '登录失败')
|
|||
|
|
}
|
|||
|
|
return await response.json()
|
|||
|
|
} catch (error) {
|
|||
|
|
console.error('Login error:', error)
|
|||
|
|
throw error
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 2.2 验证修复
|
|||
|
|
1. 保存 `api.ts` 文件
|
|||
|
|
2. 检查 `Login.vue` 组件中的导入语句：
|
|||
|
|
```typescript
|
|||
|
|
import { login } from '../services/api'
|
|||
|
|
```
|
|||
|
|
3. 运行前端开发服务器，验证登录功能是否正常工作
|
|||
|
|
|
|||
|
|
## 3. 预期结果
|
|||
|
|
- 登录功能能够正常调用后端API
|
|||
|
|
- 不再出现 "does not provide an export named 'login'" 错误
|
|||
|
|
- 用户能够正常登录并访问管理后台
|
|||
|
|
|
|||
|
|
## 4. 技术要点
|
|||
|
|
- 确保函数使用 `export` 关键字正确导出
|
|||
|
|
- 函数签名与类型定义匹配
|
|||
|
|
- API调用逻辑正确，能够处理成功和失败情况
|