hookehuyr

feat(article): 文章详情页导航栏显示动态文章标题

- 将 NavHeader 的 title 从固定"文章详情"改为动态绑定
- 新增 displayTitle 计算属性,支持标题过长时自动截断(15 字符 + 省略号)
- 加载中/失败时仍显示默认"文章详情"文案

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
......@@ -5,7 +5,7 @@
<template>
<view class="article-detail-page">
<!-- 导航栏 -->
<NavHeader title="文章详情" />
<NavHeader :title="displayTitle" />
<!-- 滚动容器 -->
<view class="flex-1 pb-safe">
......@@ -126,6 +126,23 @@ const formattedDate = computed(() => {
})
/**
* 导航栏显示标题(截断过长标题)
*
* @description 最多显示 15 个字符,超过则添加省略号
*/
const displayTitle = computed(() => {
// 加载中或加载失败时显示默认标题
if (!article.value?.title) return '文章详情'
const MAX_LENGTH = 15
const title = article.value.title.trim()
return title.length > MAX_LENGTH
? title.slice(0, MAX_LENGTH) + '...'
: title
})
/**
* 获取文章详情
*/
const fetchArticleDetail = async () => {
......