From b042e870f03d2c46d7fef47d98016ea9e4a434be Mon Sep 17 00:00:00 2001
From: taohebin <taohebin@dcloud.io>
Date: Sat, 19 Aug 2023 17:18:42 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E8=87=AA=E5=AE=9A?=
 =?UTF-8?q?=E4=B9=89=E4=B8=8B=E6=8B=89=E5=88=B7=E6=96=B0=E5=B1=9E=E6=80=A7?=
 =?UTF-8?q?=E4=BE=8B=E5=AD=90=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages.json                                    | 11 ++-
 .../scroll-view-custom-refresher-props.uvue   | 75 +++++++++++++++++++
 pages/component/scroll-view/scroll-view.uvue  | 15 +++-
 .../custom-refresher/custom-refresher.uvue    |  9 ++-
 .../refresh-box/refresh-box.uvue              |  2 +-
 5 files changed, 106 insertions(+), 6 deletions(-)
 create mode 100644 pages/component/scroll-view/scroll-view-custom-refresher-props.uvue

diff --git a/pages.json b/pages.json
index 2eef6335..ce258e63 100644
--- a/pages.json
+++ b/pages.json
@@ -788,7 +788,16 @@
 				"enablePullDownRefresh": false
 			}
 		}
-	],
+	    ,{
+            "path" : "pages/component/scroll-view/scroll-view-custom-refresher-props",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "自定义下拉刷新的scroll-view属性示例",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+    ],
 	"globalStyle": {
 		"pageOrientation": "portrait",
 		"navigationBarTitleText": "Hello uniapp x",
diff --git a/pages/component/scroll-view/scroll-view-custom-refresher-props.uvue b/pages/component/scroll-view/scroll-view-custom-refresher-props.uvue
new file mode 100644
index 00000000..56a8d5f4
--- /dev/null
+++ b/pages/component/scroll-view/scroll-view-custom-refresher-props.uvue
@@ -0,0 +1,75 @@
+<template>
+	<!-- #ifdef APP -->
+	<scroll-view style="flex:1" :refresher-enabled="true" :refresher-triggered="refresherTriggered"
+		refresher-default-style="none" @refresherpulling="onRefresherpulling" @refresherrefresh="onRefresherrefresh">
+		<!-- #endif -->
+		<scroll-view style="margin: 50rpx;">
+			<view v-for="i in 20" class="content-item">
+				<text class="text">item-{{i}}</text>
+			</view>
+		</scroll-view>
+		<refresh-box slot="refresher" :state="state"></refresh-box>
+		<!-- #ifdef APP -->
+	</scroll-view>
+	<!-- #endif -->
+</template>
+
+<script>
+	import RefresherEvent from 'io.dcloud.uniapp.runtime.RefresherEvent';
+	import refreshBox from '../../template/custom-refresher/refresh-box/refresh-box.uvue';
+	export default {
+		components: { refreshBox },
+		data() {
+			return {
+				refresherTriggered: false,
+				pullingDistance: 0,
+				resetting: false
+			}
+		},
+		computed: {
+			state() : number {
+				if (this.resetting) {
+					return 3;
+				}
+				if (this.refresherTriggered) {
+					return 2
+				}
+				if (this.pullingDistance > 45) {
+					return 1
+				} else {
+					return 0;
+				}
+			}
+		},
+		methods: {
+			onRefresherpulling(e : RefresherEvent) {
+				this.pullingDistance = e.detail.dy;
+				if (this.pullingDistance.toDouble() == 0.0) {
+					this.resetting = false;
+				}
+			},
+			onRefresherrefresh() {
+				this.refresherTriggered = true
+				setTimeout(() => {
+					this.refresherTriggered = false
+					this.resetting = true;
+				}, 1500)
+			},
+		}
+	}
+</script>
+
+<style>
+	.content-item {
+		padding: 15px;
+		margin: 5px 0;
+		background-color: #fff;
+		border-radius: 5px;
+	}
+
+	.text {
+		font-size: 14px;
+		color: #666;
+		line-height: 20px;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/component/scroll-view/scroll-view.uvue b/pages/component/scroll-view/scroll-view.uvue
index 1aba4732..a925221b 100644
--- a/pages/component/scroll-view/scroll-view.uvue
+++ b/pages/component/scroll-view/scroll-view.uvue
@@ -73,11 +73,15 @@
 		  class="button default-button"
 		  @click="moreProps"
 		>
-		  非下拉刷新的scroll-view属性示例
+		  非下拉刷新的属性示例
 		</button>
 		<view class="uni-common-pb"></view>
 		<button type="primary" class="button default-button" @click="jumpToRefresher">
-			下拉刷新的scroll-view属性示例
+			下拉刷新的属性示例
+		</button>
+		<view class="uni-common-pb"></view>
+		<button type="primary" class="button default-button" @click="jumpToCustomRefresher">
+			自定义下拉刷新的属性示例
 		</button>
 		<view class="uni-common-pb"></view>
       </view>
@@ -132,7 +136,12 @@ export default {
 		uni.navigateTo({
 		  url: '/pages/component/scroll-view/scroll-view-refresher-props',
 		})
-	},
+	},
+	jumpToCustomRefresher() {
+		uni.navigateTo({
+		  url: '/pages/component/scroll-view/scroll-view-custom-refresher-props',
+		})
+	}
   },
 }
 </script>
diff --git a/pages/template/custom-refresher/custom-refresher.uvue b/pages/template/custom-refresher/custom-refresher.uvue
index 366a01aa..02df00cf 100644
--- a/pages/template/custom-refresher/custom-refresher.uvue
+++ b/pages/template/custom-refresher/custom-refresher.uvue
@@ -23,11 +23,15 @@
       return {
         refresherTriggered:false,
         refresherThreshold:40,
-        pullingDistance:0
+        pullingDistance:0,
+		resetting: false
       }
     },
     computed:{
       state():number{
+		if (this.resetting) {
+		  return 3;
+		}
         if(this.refresherTriggered){
           return 2
         }
@@ -42,6 +46,9 @@
       onRefresherpulling(e:RefresherEvent){
         // console.log('onRefresherpulling',e.detail.dy)
         this.pullingDistance = e.detail.dy
+		if (this.pullingDistance.toDouble() == 0.0) {
+			this.resetting = false;
+		}
       },
       onRefresherrefresh(){
         this.refresherTriggered = true
diff --git a/pages/template/custom-refresher/refresh-box/refresh-box.uvue b/pages/template/custom-refresher/refresh-box/refresh-box.uvue
index 70a324d7..f8e1eec6 100644
--- a/pages/template/custom-refresher/refresh-box/refresh-box.uvue
+++ b/pages/template/custom-refresher/refresh-box/refresh-box.uvue
@@ -11,7 +11,7 @@
   export default {
     data() {
       return {
-        text: ['继续下拉执行刷新', '释放立即刷新', '刷新中']
+        text: ['继续下拉执行刷新', '释放立即刷新', '刷新中', ""]
       }
     },
     props: {
-- 
GitLab