140 lines
3.1 KiB
Markdown
140 lines
3.1 KiB
Markdown
|
# 首页空白问题修复完成
|
|||
|
|
|
|||
|
|
## 📋 问题回顾
|
|||
|
|
|
|||
|
|
**现象：**
|
|||
|
|
- 账号密码登录后，首页完全空白
|
|||
|
|
- 测试身份登录后，首页正常显示
|
|||
|
|
- 控制台显示：`首页加载，当前角色： parent`
|
|||
|
|
|
|||
|
|
## 🔍 问题分析
|
|||
|
|
|
|||
|
|
### 问题1：角色值不匹配
|
|||
|
|
|
|||
|
|
**控制台日志：**
|
|||
|
|
```
|
|||
|
|
首页加载，当前角色： parent
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
**首页判断代码：**
|
|||
|
|
```vue
|
|||
|
|
<view v-if="currentRole === 'user'">
|
|||
|
|
<UserHome />
|
|||
|
|
</view>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
**结果：** `'parent' !== 'user'` → 条件不匹配 → 首页不显示
|
|||
|
|
|
|||
|
|
### 问题2：条件渲染逻辑错误
|
|||
|
|
|
|||
|
|
**原代码（pages/index/index.vue）：**
|
|||
|
|
```vue
|
|||
|
|
<view v-if="currentRole === 'user'">...</view>
|
|||
|
|
<view v-else-if="currentRole === 'teacher'">...</view>
|
|||
|
|
<view v-if="currentRole === 'manager' || ...">...</view> ❌ 应该用 v-else-if
|
|||
|
|
<view v-else-if="currentRole === 'distributor'">...</view>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
第14行用了 `v-if` 而不是 `v-else-if`，导致条件判断链断裂。
|
|||
|
|
|
|||
|
|
### 问题3：登录时未保存 currentRole
|
|||
|
|
|
|||
|
|
**原代码（parent-register.vue）：**
|
|||
|
|
```javascript
|
|||
|
|
uni.setStorageSync('token', 'mock_token_' + Date.now())
|
|||
|
|
uni.setStorageSync('userInfo', userInfo)
|
|||
|
|
// ❌ 缺少这行
|
|||
|
|
// uni.setStorageSync('currentRole', 'user')
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## ✅ 修复方案
|
|||
|
|
|
|||
|
|
### 修复1：统一使用 'user' 作为家长角色
|
|||
|
|
|
|||
|
|
**修改文件：** `peidu/uniapp/pages/auth/parent-register.vue`
|
|||
|
|
|
|||
|
|
**修改内容：**
|
|||
|
|
```javascript
|
|||
|
|
// 添加 currentRole 保存
|
|||
|
|
uni.setStorageSync('currentRole', 'user')
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 修复2：修复条件渲染逻辑
|
|||
|
|
|
|||
|
|
**修改文件：**
|
|||
|
|
- `peidu/uniapp/pages/index/index.vue`
|
|||
|
|
- `peidu/uniapp/src/pages/index/index.vue`
|
|||
|
|
|
|||
|
|
**修改内容：**
|
|||
|
|
```vue
|
|||
|
|
<!-- 修改前 -->
|
|||
|
|
<view v-if="currentRole === 'manager' || currentRole === undefined || currentRole === null">
|
|||
|
|
|
|||
|
|
<!-- 修改后 -->
|
|||
|
|
<view v-else-if="currentRole === 'manager'">
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 修复3：真实API登录也保存 currentRole
|
|||
|
|
|
|||
|
|
**修改文件：** `peidu/uniapp/src/pages/auth/parent-register.vue`
|
|||
|
|
|
|||
|
|
**修改内容：**
|
|||
|
|
```javascript
|
|||
|
|
uni.setStorageSync('currentRole', (res.data.userInfo || res.data).role || 'user')
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 🧪 测试步骤
|
|||
|
|
|
|||
|
|
1. **清除缓存**
|
|||
|
|
- 关闭微信开发者工具
|
|||
|
|
- 重新打开项目
|
|||
|
|
|
|||
|
|
2. **重新登录**
|
|||
|
|
- 使用账号密码登录：`13800138000` / `123456`
|
|||
|
|
|
|||
|
|
3. **检查结果**
|
|||
|
|
- ✅ 首页应该正常显示家长端内容
|
|||
|
|
- ✅ 控制台应该显示：`首页加载，当前角色： user`
|
|||
|
|
|
|||
|
|
## 📊 修复前后对比
|
|||
|
|
|
|||
|
|
### 修复前
|
|||
|
|
```
|
|||
|
|
登录 → currentRole = 'parent' (或未设置)
|
|||
|
|
↓
|
|||
|
|
首页判断 currentRole === 'user' → false
|
|||
|
|
↓
|
|||
|
|
页面空白
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 修复后
|
|||
|
|
```
|
|||
|
|
登录 → currentRole = 'user' ✅
|
|||
|
|
↓
|
|||
|
|
首页判断 currentRole === 'user' → true ✅
|
|||
|
|
↓
|
|||
|
|
显示 UserHome 组件 ✅
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 🎯 总结
|
|||
|
|
|
|||
|
|
**根本原因：**
|
|||
|
|
1. 登录时没有保存 `currentRole`
|
|||
|
|
2. 首页条件渲染逻辑错误
|
|||
|
|
3. 角色值不统一
|
|||
|
|
|
|||
|
|
**解决方法：**
|
|||
|
|
1. 登录时显式保存 `currentRole = 'user'`
|
|||
|
|
2. 修复条件渲染链（v-if → v-else-if）
|
|||
|
|
3. 统一使用 `'user'` 作为家长角色
|
|||
|
|
|
|||
|
|
**影响范围：**
|
|||
|
|
- 账号密码登录功能
|
|||
|
|
- 首页显示逻辑
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
**修复时间：** 2026-01-27
|
|||
|
|
**修复人员：** Kiro AI
|
|||
|
|
**相关问题：** 账号密码登录问题、message表缺失问题
|