feat(小程序): 测评/调研/政策页适配沉浸式导航,标题区统一复用 PageHeader 并内置返回按钮

This commit is contained in:
Pine
2026-08-29 00:36:17 +08:00
parent f77c8adc07
commit 48ed5353bc
6 changed files with 28 additions and 27 deletions
+15 -2
View File
@@ -25,8 +25,9 @@ export function getTopInset() {
}
/** 统一固定标题区(fixed 不随滚动):像素字 kicker + 彩虹渐变标题 + 像素字注脚。
* back:传入函数=自定义返回;true=自动返回(无上一页则回首页 Tab)。
* 占位高度由 createSelectorQuery 实测 navbar 真实高度,绝无空白/覆盖/重复。 */
export function PageHeader({ no, title, en, sub }) {
export function PageHeader({ no, title, en, sub, back }) {
const { navH, windowWidth } = getTopInset();
// 标题区整体上移 65rpx:从状态栏让位空间中扣除(不是容器偏移,占位实测自动跟随,无空白)
const SHIFT_PX = Math.round((65 * (windowWidth || 375)) / 750);
@@ -40,7 +41,14 @@ export function PageHeader({ no, title, en, sub }) {
.boundingClientRect((r) => { if (r && r.height) setH(r.height); })
.exec();
});
}, [no, title, en, sub]);
}, [no, title, en, sub, back]);
const goBack = () => {
if (typeof back === 'function') { back(); return; }
const pages = Taro.getCurrentPages ? Taro.getCurrentPages() : [];
if (pages.length > 1) Taro.navigateBack({ delta: 1 });
else Taro.switchTab({ url: '/pages/index/index' });
};
return (
<>
@@ -48,6 +56,11 @@ export function PageHeader({ no, title, en, sub }) {
<View className="page-navbar-col">
{no ? <Text className="page-navbar-no">{no}</Text> : null}
<View className="page-navbar-titlerow">
{back ? (
<View className="page-navbar-back" hoverClass="pressed" onClick={goBack}>
<Text className="ic ic-arrow-left" aria-hidden />
</View>
) : null}
<Text className="page-navbar-title">{title}</Text>
{sub ? <Text className="page-navbar-sub">{sub}</Text> : null}
</View>