From 5adbe3f18dacf2071952282314a7afe3c2da4f34 Mon Sep 17 00:00:00 2001
From: huangzhe <3451701311@qq.com>
Date: Mon, 25 Aug 2025 14:36:41 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0navbar=E5=AF=BC?=
 =?UTF-8?q?=E8=88=AA=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

修复屏幕宽度过宽导致的苹果手机无法返回的问题
---
 components/page-title/page-title.vue | 22 +++++++++++++++++-----
 pages/study/courseStudy.vue          |  1 +
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/components/page-title/page-title.vue b/components/page-title/page-title.vue
index ace9517..6fb95fd 100644
--- a/components/page-title/page-title.vue
+++ b/components/page-title/page-title.vue
@@ -1,5 +1,5 @@
 <template>
-	<view class="top">
+	<view class="top" :class="[sticky ? 'sticky': '']">
 		<view v-show="showBack" class="top-back" @click="toBack()">
 			<u-icon color="#333" size="20" name="arrow-left"></u-icon>
 		</view>
@@ -24,11 +24,16 @@
 			goPgae:{
 				type:String,
 				default:''
-			}
+			},
+      // 启用粘性滚动
+      sticky: {
+        type: Boolean,
+        default: false
+      }
 		},
 		data() {
 			return {
-				
+
 			}
 		},
 		methods: {
@@ -45,7 +50,7 @@
 						uni.switchTab({
 							url:this.backUrl
 						})
-					}else{						
+					}else{
 						uni.navigateTo({
 							url:this.backUrl
 						});
@@ -61,7 +66,7 @@
 					}else{
 						uni.navigateBack();
 					}
-					
+
 				}
 			}
 		}
@@ -94,6 +99,13 @@
 			text-overflow: ellipsis;
 			line-height: 40px;
 		}
+
+    &.sticky {
+      position: sticky;
+      top: 0;
+      //防止其他元素遮盖
+      z-index: 99;
+    }
 	}
 	 // .arrow:before {
 	 //    content: " ";
diff --git a/pages/study/courseStudy.vue b/pages/study/courseStudy.vue
index 29aaaef..6eab772 100644
--- a/pages/study/courseStudy.vue
+++ b/pages/study/courseStudy.vue
@@ -1,6 +1,7 @@
 <template>
 	<!--新的课程学习页面，没有中间的详细页面了，课程点过来就是这个，用户未报名就直接报名-->
 	<view>
+    <page-title :showBack="true" :sticky="true">视频详情</page-title>
 		<watermark></watermark>
 		<u-toast ref="messager"></u-toast>
 		<!-- <page-title :showBack="true"></page-title> -->