From 52112ded9d9211c4bd8878784d484da30ea90829 Mon Sep 17 00:00:00 2001
From: shutao <shutao@dcloud.io>
Date: Wed, 8 Nov 2023 19:06:41 +0800
Subject: [PATCH] add sticky-section.uvue

---
 pages.json                                    |  8 ++++
 .../sticky-header/sticky-header.test.js       |  3 +-
 .../sticky-section/sticky-section.test.js     | 14 ++++++
 .../sticky-section/sticky-section.uvue        | 48 +++++++++++++++++++
 pages/tabBar/component.uvue                   |  3 ++
 5 files changed, 74 insertions(+), 2 deletions(-)
 create mode 100644 pages/component/sticky-section/sticky-section.test.js
 create mode 100644 pages/component/sticky-section/sticky-section.uvue

diff --git a/pages.json b/pages.json
index 45f51461..2525fb70 100644
--- a/pages.json
+++ b/pages.json
@@ -1059,6 +1059,14 @@
       {
         "navigationBarTitleText" : "打开schema示例"
       }
+    },
+    {
+      "path" : "pages/component/sticky-section/sticky-section",
+      "style" : 
+      {
+        "navigationBarTitleText" : "sticky-section",
+        "enablePullDownRefresh" : false
+      }
     }
 
   ],
diff --git a/pages/component/sticky-header/sticky-header.test.js b/pages/component/sticky-header/sticky-header.test.js
index 3e1cbac9..2bd2af47 100644
--- a/pages/component/sticky-header/sticky-header.test.js
+++ b/pages/component/sticky-header/sticky-header.test.js
@@ -2,13 +2,12 @@ describe('component-native-sticky-header', () => {
   let page
   beforeAll(async () => {
     page = await program.reLaunch('/pages/component/sticky-header/sticky-header')
-    await page.waitFor(200)
+    await page.waitFor('sticky-header')
   })
 
   //检测吸顶效果
   it('check_sticky_header', async () => {
     await page.callMethod('confirm_scroll_top_input', 600)
-    await page.waitFor(400)
     const image = await program.screenshot();
     expect(image).toMatchImageSnapshot();
   })
diff --git a/pages/component/sticky-section/sticky-section.test.js b/pages/component/sticky-section/sticky-section.test.js
new file mode 100644
index 00000000..692525de
--- /dev/null
+++ b/pages/component/sticky-section/sticky-section.test.js
@@ -0,0 +1,14 @@
+describe('component-native-sticky-section', () => {
+  let page
+  beforeAll(async () => {
+    page = await program.reLaunch('/pages/component/sticky-section/sticky-section')
+    await page.waitFor('sticky-section')
+  })
+
+  //检测吸顶上推效果
+  it('check_sticky_section', async () => {
+    await page.callMethod('listViewScrollByY', 1000)
+    const image = await program.screenshot();
+    expect(image).toMatchImageSnapshot();
+  })
+})
diff --git a/pages/component/sticky-section/sticky-section.uvue b/pages/component/sticky-section/sticky-section.uvue
new file mode 100644
index 00000000..6495a627
--- /dev/null
+++ b/pages/component/sticky-section/sticky-section.uvue
@@ -0,0 +1,48 @@
+<template>
+	<list-view :scroll-y="true" ref="list-view" class="page" scroll-x="true" rebound="false">
+    <sticky-section v-for="(sectionText) in data" :padding="sectionPadding" :push-pinned-header="true">
+    	<sticky-header :header-id="sectionText">
+    		<text class="sticky-header-text">{{sectionText}}</text>
+    	</sticky-header>
+    	<list-item v-for="i in 10" class="content-item" :type=10>
+    		<text class="text">{{sectionText}}--item--content----{{i}}</text>
+    	</list-item>
+    </sticky-section>
+  </list-view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+          data: ['A','B','C','D','E','F','G','H','I','J','K','L','M','N'],
+          sectionPadding: [0,10,0,10] as Array <number>
+			}
+		},
+		methods: {
+      //用于自动化测试
+      listViewScrollByY(y : number) {
+        const listview = this.$refs["list-view"] as Element
+        listview.scrollBy(0, y)
+      }
+		}
+	}
+</script>
+
+<style>
+  .page {
+		flex: 1;
+		background-color: #f5f5f5;
+	}
+  .sticky-header-text {
+  	font-size: 16px;
+  	padding: 8px;
+  	color: #959595;
+  	background-color: #f5f5f5;
+  }
+  .content-item {
+  	padding: 15px;
+  	margin: 5px 0;
+  	background-color: #fff;
+  }
+</style>
diff --git a/pages/tabBar/component.uvue b/pages/tabBar/component.uvue
index ae6ef628..c31f51c6 100644
--- a/pages/tabBar/component.uvue
+++ b/pages/tabBar/component.uvue
@@ -98,6 +98,9 @@ export default {
             },
             {
               name: 'sticky-header',
+            },
+            {
+              name: 'sticky-section',
             }
           ] as Page[],
         },
-- 
GitLab