refactor(message): 简化消息列表逻辑
- 只使用 title 字段显示标题,移除 note 降级处理 - 标题完整显示,不再省略(移除 line-clamp-1) - 预览简化为固定文本:"点击查看详情"或"暂无内容" - 删除 getItemTitle 和 getItemPreview 辅助函数(-50 行) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Showing
1 changed file
with
6 additions
and
56 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date:2026-02-08 | 2 | * @Date:2026-02-08 |
| 3 | * @Description: 我的消息页 - 使用 LoadMoreList 组件重构版本 | 3 | * @Description: 我的消息页 - 使用 LoadMoreList 组件重构版本 |
| 4 | - * @Update:2026-02-13 API 新增 title 字段,直接使用 API 返回的标题 | 4 | + * @Update:2026-02-14 简化逻辑:只使用 title 字段,移除 note 相关处理 |
| 5 | --> | 5 | --> |
| 6 | <template> | 6 | <template> |
| 7 | <LoadMoreList | 7 | <LoadMoreList |
| ... | @@ -33,9 +33,9 @@ | ... | @@ -33,9 +33,9 @@ |
| 33 | <view class="flex-1 mr-2 relative"> | 33 | <view class="flex-1 mr-2 relative"> |
| 34 | <!-- 未读红点 --> | 34 | <!-- 未读红点 --> |
| 35 | <view v-if="item.status === 'send'" class="absolute -left-2 top-1.5 w-1.5 h-1.5 bg-red-500 rounded-full"></view> | 35 | <view v-if="item.status === 'send'" class="absolute -left-2 top-1.5 w-1.5 h-1.5 bg-red-500 rounded-full"></view> |
| 36 | - <!-- 标题:优先使用 API 返回的 title,降级使用 note 第一行 --> | 36 | + <!-- 标题:使用 API 返回的 title --> |
| 37 | - <text class="text-lg font-bold text-gray-900 line-clamp-1 leading-snug"> | 37 | + <text class="text-lg font-bold text-gray-900 leading-snug"> |
| 38 | - {{ item.title || getItemTitle(item.note) }} | 38 | + {{ item.title || '暂无标题' }} |
| 39 | </text> | 39 | </text> |
| 40 | </view> | 40 | </view> |
| 41 | 41 | ||
| ... | @@ -50,8 +50,8 @@ | ... | @@ -50,8 +50,8 @@ |
| 50 | 50 | ||
| 51 | <!-- 中间:内容预览 --> | 51 | <!-- 中间:内容预览 --> |
| 52 | <view class="mb-4"> | 52 | <view class="mb-4"> |
| 53 | - <text class="text-sm text-gray-500 line-clamp-2 leading-relaxed"> | 53 | + <text class="text-sm text-gray-500 leading-relaxed"> |
| 54 | - {{ getItemPreview(item.note) }} | 54 | + {{ item.note ? '点击查看详情' : '暂无内容' }} |
| 55 | </text> | 55 | </text> |
| 56 | </view> | 56 | </view> |
| 57 | 57 | ||
| ... | @@ -100,56 +100,6 @@ const loadingMore = ref(false) | ... | @@ -100,56 +100,6 @@ const loadingMore = ref(false) |
| 100 | // 标记:是否首次加载(用于区分 useLoad 和 useDidShow) | 100 | // 标记:是否首次加载(用于区分 useLoad 和 useDidShow) |
| 101 | const isFirstLoad = ref(true) | 101 | const isFirstLoad = ref(true) |
| 102 | 102 | ||
| 103 | -/** | ||
| 104 | - * 提取消息标题(降级方案:从 note 第一行提取) | ||
| 105 | - * | ||
| 106 | - * @description 当 API 未返回 title 时,从 note 内容的第一行提取标题 | ||
| 107 | - * @param {string} note - 消息内容 | ||
| 108 | - * @returns {string} 标题 | ||
| 109 | - * | ||
| 110 | - * @example | ||
| 111 | - * // API 已返回 title | ||
| 112 | - * getItemTitle(note) // 不使用,直接显示 item.title | ||
| 113 | - * // API 未返回 title(降级) | ||
| 114 | - * getItemTitle('这是第一行标题\n这是内容') // 返回: '这是第一行标题' | ||
| 115 | - */ | ||
| 116 | -const getItemTitle = (note) => { | ||
| 117 | - if (!note) return '暂无消息内容' | ||
| 118 | - | ||
| 119 | - // 提取第一行作为标题 | ||
| 120 | - const firstLine = note.split('\n')[0] | ||
| 121 | - | ||
| 122 | - // 移除富文本标签(简单处理) | ||
| 123 | - const textOnly = firstLine.replace(/<[^>]+>/g, '').trim() | ||
| 124 | - | ||
| 125 | - // 如果第一行太长,截取前 50 个字符 | ||
| 126 | - return textOnly.length > 50 ? textOnly.substring(0, 50) + '...' : textOnly | ||
| 127 | -} | ||
| 128 | - | ||
| 129 | -/** | ||
| 130 | - * 提取消息预览 | ||
| 131 | - * | ||
| 132 | - * @description 移除第一行标题后的内容作为预览 | ||
| 133 | - * @param {string} note - 消息内容 | ||
| 134 | - * @returns {string} 预览内容 | ||
| 135 | - * | ||
| 136 | - * @example | ||
| 137 | - * getItemPreview('标题\n内容第二行\n内容第三行') // 返回: '内容第二行\n内容第三行' | ||
| 138 | - * getItemPreview('只有单行内容') // 返回: '点击查看详情' | ||
| 139 | - */ | ||
| 140 | -const getItemPreview = (note) => { | ||
| 141 | - if (!note) return '点击查看详情' | ||
| 142 | - | ||
| 143 | - // 移除第一行(已作为标题显示) | ||
| 144 | - const lines = note.split('\n') | ||
| 145 | - if (lines.length > 1) { | ||
| 146 | - // 移除富文本标签(简单处理) | ||
| 147 | - const preview = lines.slice(1).join('\n').replace(/<[^>]+>/g, '').trim() | ||
| 148 | - return preview || '点击查看详情' | ||
| 149 | - } | ||
| 150 | - | ||
| 151 | - return '点击查看详情' // 只有一行时 | ||
| 152 | -} | ||
| 153 | 103 | ||
| 154 | /** | 104 | /** |
| 155 | * 获取消息列表 | 105 | * 获取消息列表 | ... | ... |
-
Please register or login to post a comment