add sticky-section.uvue

pages.json

@@ -1059,6 +1059,14 @@
       {
         "navigationBarTitleText" : "打开schema示例"
       }
+    },
+    {
+      "path" : "pages/component/sticky-section/sticky-section",
+      "style" : 
+      {
+        "navigationBarTitleText" : "sticky-section",
+        "enablePullDownRefresh" : false
+      }
     }
 
   ],

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();
   })

pages/component/sticky-section/sticky-section.test.js

+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();
+  })
+})

pages/component/sticky-section/sticky-section.uvue

+<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>

pages/tabBar/component.uvue

@@ -98,6 +98,9 @@ export default {
             },
             {
               name: 'sticky-header',
+            },
+            {
+              name: 'sticky-section',
             }
           ] as Page[],
         },