1

pages/catalog/index.uvue

@@ -9,7 +9,7 @@ import Back from '@/components/back.uvue'
 import Loading from '@/components/loading.uvue'
 import { config } from '@/config'
 import { dict } from '@/.cool/store'
-import { router } from "@/.cool";
+import { router,debounce } from "@/.cool";
 
 const isLoading = ref(true)
 const visible = ref<boolean>(false)
@@ -53,27 +53,45 @@ function handleDetail(item: SubjectCatalogResult) {
     }
   });
 }
-function handleSelect(val: SubjectCatalogResult) {
+const scrollLeft = ref<any>(0)
+async function handleSelect(val: SubjectCatalogResult) {
   catalog.value = val
   visible.value = false
-  uni.createSelectorQuery().select(`.category-${val.id}`).boundingClientRect().exec((rect) => {
+  uni.createSelectorQuery().select(`.category-${val.id}`).boundingClientRect().exec(async (rect) => {
     if (cardsScrollView.value && rect[0]) {
       cardsScrollView.value.scrollTo({
-        left: rect[0].left - dict.getWindowHeight() / 2, // 减去顶部偏移
+        left:scrollLeft.value + rect[0].left - dict.getWindowHeight() / 2, // 减去顶部偏移
         animated: true
       })
     }
   })
 }
-async function onScroll(e: any) {
-  console.log();
+// const debouncedOnScroll = debounce(async () => {
+//   if(isScrolling.value){
+//     return
+//   }
+//   dataList.value.forEach(async (category) => {
+//     const selector = `.category-${category.id}`
+//     await uni.createSelectorQuery().selectAll(selector).boundingClientRect().exec((rects) => {
+//       for (const rect of rects[0]) {
+//         if (rect.left <= (dict.getWindowHeight() / 2)&&rect.left>0) {
+//           catalog.value = category
+//           return
+//         }
+//       }
+//     })
+//   })
+// }, 300)
+function debouncedOnScroll(e:any) {
+  console.log(e);
+ scrollLeft.value = e.detail.scrollLeft
   dataList.value.forEach(async (category) => {
     const selector = `.category-${category.id}`
     await uni.createSelectorQuery().selectAll(selector).boundingClientRect().exec((rects) => {
-      // 检查元素是否在可视区域内
       for (const rect of rects[0]) {
-        if (rect.left <= (dict.getWindowHeight() / 2)) {
+        if (rect.left <= (dict.getWindowHeight() / 2)&&rect.left>0) {
           catalog.value = category
+          return
         }
       }
     })
@@ -101,7 +119,7 @@ async function onScroll(e: any) {
     </view>
     <view class="boxs">
       <scroll-view class="scroll-view_H" direction="horizontal" :show-scrollbar="false" ref="cardsScrollView"
-        @scroll="onScroll">
+        @scroll="debouncedOnScroll">
         <view class="scroll-view-item_H bg-[white]" v-for="course in courseList || []"
           :class="`category-${course.catalogId}`" :key="course.id" @tap="handleDetail(course)" ref="categoryRefs">
           <cl-image :src="config.baseUrl + course?.fileList?.[0]?.url" mode="scaleToFill"

pages/test/index.uvue

@@ -45,26 +45,27 @@ function handleDetail(item: SubjectCourseTestResult) {
     }
   });
 }
+const scrollLeft = ref<any>(0)
 function handleSelect(val: SubjectCatalogResult) {
   catalog.value = val
   visible.value = false
   uni.createSelectorQuery().select(`.category-${val.id}`).boundingClientRect().exec((rect) => {
     if (cardsScrollView.value && rect[0]) {
       cardsScrollView.value.scrollTo({
-        left: rect[0].left - 50, // 减去顶部偏移
+        left:scrollLeft.value + rect[0].left - 50, // 减去顶部偏移
         animated: true
       })
     }
   })
 }
 async function onScroll(e: any) {
-  console.log();
+  scrollLeft.value = e.detail.scrollLeft
   dataList.value.forEach(async (category) => {
     const selector = `.category-${category.id}`
     await uni.createSelectorQuery().selectAll(selector).boundingClientRect().exec((rects) => {
       // 检查元素是否在可视区域内
       for (const rect of rects[0]) {
-        if (rect.left <= 50) {
+        if (rect.left <= 50&&rect.left>0) {
           catalog.value = category
         }
       }