Update list-view.uvue

pages/component/list-view/list-view.uvue

 <script>
-
-export default {
+  export default {
     data() {
       return {
         refresher_triggered_boolean: false,
@@ -15,13 +14,13 @@ export default {
         scroll_top_input: 0,
         scroll_left_input: 0,
         refresher_background_input: "#FFF",
-      scrollData: [] as Array <string>
+        scrollData: [] as Array<string>
       }
     },
     onLoad() {
-  	let lists: Array < string > = []
+      let lists : Array<string> = []
       for (let i = 0; i < 10; i++) {
-  		lists.push("item---"+i)
+        lists.push("item---" + i)
       }
       this.scrollData = lists
     },
@@ -34,7 +33,13 @@ export default {
       list_view_tap() { console.log("手指触摸后马上离开") },
       list_view_longpress() { console.log("如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。") },
       list_view_refresherpulling() { console.log("自定义下拉刷新控件被下拉") },
-		list_view_refresherrefresh() { console.log("自定义下拉刷新被触发") },
+      list_view_refresherrefresh() { 
+        console.log("自定义下拉刷新被触发") 
+        this.refresher_triggered_boolean = true
+        setTimeout(function(){
+        	this.refresher_triggered_boolean = false
+        }, 1500)
+      },
       list_view_refresherrestore() { console.log("自定义下拉刷新被复位") },
       list_view_refresherabort() { console.log("自定义下拉刷新被中止") },
       list_view_scrolltoupper() { console.log("滚动到顶部/左边，会触发 scrolltoupper 事件") },
@@ -60,30 +65,53 @@ export default {
       confirm_scroll_left_input(value : number) { this.scroll_left_input = value },
       confirm_refresher_background_input(value : string) { this.refresher_background_input = value }
     }
-}
+  }
 </script>
 
 <template>
   <view class="main">
-	<list-view :scroll-x="scroll_x_boolean" :scroll-y="scroll_y_boolean" :rebound="rebound_boolean" :upper-threshold="upper_threshold_input" :lower-threshold="lower_threshold_input" :scroll-top="scroll_top_input" :scroll-left="scroll_left_input" :show-scrollbar="show_scrollbar_boolean" :scroll-with-animation="scroll_with_animation_boolean" :refresher-enabled="refresher_enabled_boolean" :refresher-background="refresher_background_input" :refresher-triggered="refresher_triggered_boolean" @click="list_view_click" @touchstart="list_view_touchstart" @touchmove="list_view_touchmove" @touchcancel="list_view_touchcancel" @touchend="list_view_touchend" @tap="list_view_tap" @longpress="list_view_longpress" @refresherpulling="list_view_refresherpulling" @refresherrefresh="list_view_refresherrefresh" @refresherrestore="list_view_refresherrestore" @refresherabort="list_view_refresherabort" @scrolltoupper="list_view_scrolltoupper" @scrolltolower="list_view_scrolltolower" @scroll="list_view_scroll" style="width:100%;"><list-item v-for="key in scrollData" :key="key" @click="list_item_click" @touchstart="list_item_touchstart" @touchmove="list_item_touchmove" @touchcancel="list_item_touchcancel" @touchend="list_item_touchend" @tap="list_item_tap" @longpress="list_item_longpress" class="list-item"><text>{{key}}</text></list-item></list-view>
+    <list-view :scroll-x="scroll_x_boolean" :scroll-y="scroll_y_boolean" :rebound="rebound_boolean"
+      :upper-threshold="upper_threshold_input" :lower-threshold="lower_threshold_input" :scroll-top="scroll_top_input"
+      :scroll-left="scroll_left_input" :show-scrollbar="show_scrollbar_boolean"
+      :scroll-with-animation="scroll_with_animation_boolean" :refresher-enabled="refresher_enabled_boolean"
+      :refresher-background="refresher_background_input" :refresher-triggered="refresher_triggered_boolean"
+      @click="list_view_click" @touchstart="list_view_touchstart" @touchmove="list_view_touchmove"
+      @touchcancel="list_view_touchcancel" @touchend="list_view_touchend" @tap="list_view_tap"
+      @longpress="list_view_longpress" @refresherpulling="list_view_refresherpulling"
+      @refresherrefresh="list_view_refresherrefresh" @refresherrestore="list_view_refresherrestore"
+      @refresherabort="list_view_refresherabort" @scrolltoupper="list_view_scrolltoupper"
+      @scrolltolower="list_view_scrolltolower" @scroll="list_view_scroll" style="width:100%;">
+      <list-item
+        v-for="key in scrollData" :key="key" @click="list_item_click" @touchstart="list_item_touchstart"
+        @touchmove="list_item_touchmove" @touchcancel="list_item_touchcancel" @touchend="list_item_touchend"
+        @tap="list_item_tap" @longpress="list_item_longpress"
+        class="list-item">
+        <text>{{key}}</text>
+      </list-item>
+    </list-view>
   </view>
 
   <!-- #ifdef APP -->
   <scroll-view style="flex:1">
     <!-- #endif -->
     <view class="content nvue">
-			<boolean-data :defaultValue="false" title="设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发" @change="change_refresher_triggered_boolean"></boolean-data>
+      <boolean-data :defaultValue="false" title="设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发"
+        @change="change_refresher_triggered_boolean"></boolean-data>
       <boolean-data :defaultValue="false" title="开启自定义下拉刷新" @change="change_refresher_enabled_boolean"></boolean-data>
-		<boolean-data :defaultValue="false" title="是否在设置滚动条位置时使用滚动动画，设置false没有滚动动画" @change="change_scroll_with_animation_boolean"></boolean-data>
+      <boolean-data :defaultValue="false" title="是否在设置滚动条位置时使用滚动动画，设置false没有滚动动画"
+        @change="change_scroll_with_animation_boolean"></boolean-data>
       <boolean-data :defaultValue="true" title="控制是否出现滚动条" @change="change_show_scrollbar_boolean"></boolean-data>
       <boolean-data :defaultValue="true" title="控制是否回弹效果" @change="change_rebound_boolean"></boolean-data>
       <boolean-data :defaultValue="true" title="允许纵向滚动" @change="change_scroll_y_boolean"></boolean-data>
       <boolean-data :defaultValue="false" title="允许横向滚动" @change="change_scroll_x_boolean"></boolean-data>
-		<input-data defaultValue="50" title="距顶部/左边多远时（单位px），触发 scrolltoupper 事件" type="number" @confirm="confirm_upper_threshold_input"></input-data>
-		<input-data defaultValue="50" title="距底部/右边多远时（单位px），触发 scrolltolower 事件" type="number" @confirm="confirm_lower_threshold_input"></input-data>
+      <input-data defaultValue="50" title="距顶部/左边多远时（单位px），触发 scrolltoupper 事件" type="number"
+        @confirm="confirm_upper_threshold_input"></input-data>
+      <input-data defaultValue="50" title="距底部/右边多远时（单位px），触发 scrolltolower 事件" type="number"
+        @confirm="confirm_lower_threshold_input"></input-data>
       <input-data defaultValue="0" title="设置竖向滚动条位置" type="number" @confirm="confirm_scroll_top_input"></input-data>
       <input-data defaultValue="0" title="设置横向滚动条位置" type="number" @confirm="confirm_scroll_left_input"></input-data>
-		<input-data defaultValue="#FFF" title="设置自定义下拉刷新区域背景颜色" type="text" @confirm="confirm_refresher_background_input"></input-data>
+      <input-data defaultValue="#FFF" title="设置自定义下拉刷新区域背景颜色" type="text"
+        @confirm="confirm_refresher_background_input"></input-data>
     </view>
     <!-- #ifdef APP -->
   </scroll-view>
@@ -91,21 +119,20 @@ export default {
 </template>
 
 <style>
-.main {
+  .main {
     max-height: 500rpx;
     padding: 10rpx 0;
-	border-bottom: 1px solid rgba(0,0,0,.06);
+    border-bottom: 1px solid rgba(0, 0, 0, .06);
     flex-direction: row;
     justify-content: center;
-}
+  }
 
-.main .list-item {
+  .main .list-item {
     width: 750rpx;
     height: 480rpx;
     border: 1px solid #666;
-	background-color:#66ccff;
+    background-color: #66ccff;
     align-items: center;
     justify-content: center;
-}
-
+  }
 </style>