feat: list-view-autotest 新增属性

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

 <script>
-
 export default {
 	data() {
 		return {
 			refresher_triggered_boolean: false,
 			refresher_enabled_boolean: false,
-			scrollable_boolean: true,
-			bounces_boolean: true,
-			show_scrollbar_boolean: true
+			scroll_with_animation_boolean: false,
+			show_scrollbar_boolean: true,
+			rebound_boolean: true,
+			scroll_y_boolean: false,
+			scroll_x_boolean: false,
+			upper_threshold_input: 50,
+			lower_threshold_input: 50,
+			scroll_top_input: 0,
+			scroll_left_input: 0,
+			refresher_background_input: "#FFF"
 		}
 	},
 	methods: {
@@ -22,7 +28,8 @@ export default {
 		list_view_refresherrefresh() { console.log("自定义下拉刷新被触发") },
 		list_view_refresherrestore() { console.log("自定义下拉刷新被复位") },
 		list_view_refresherabort() { console.log("自定义下拉刷新被中止") },
-		list_view_scrolltolower() { console.log("滚动到底部触发") },
+		list_view_scrolltolower() { console.log("滚动到底部/右边，会触发 scrolltolower 事件") },
+		list_view_scroll() { console.log("滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY}") },
 		list_item_click() { console.log("组件被点击时触发") },
 		list_item_touchstart() { console.log("手指触摸动作开始") },
 		list_item_touchmove() { console.log("手指触摸后移动") },
@@ -32,27 +39,41 @@ export default {
 		list_item_longpress() { console.log("如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。") },
 		change_refresher_triggered_boolean(checked : boolean) { this.refresher_triggered_boolean = checked },
 		change_refresher_enabled_boolean(checked : boolean) { this.refresher_enabled_boolean = checked },
-		change_scrollable_boolean(checked : boolean) { this.scrollable_boolean = checked },
-		change_bounces_boolean(checked : boolean) { this.bounces_boolean = checked },
-		change_show_scrollbar_boolean(checked : boolean) { this.show_scrollbar_boolean = checked }
+		change_scroll_with_animation_boolean(checked : boolean) { this.scroll_with_animation_boolean = checked },
+		change_show_scrollbar_boolean(checked : boolean) { this.show_scrollbar_boolean = checked },
+		change_rebound_boolean(checked : boolean) { this.rebound_boolean = checked },
+		change_scroll_y_boolean(checked : boolean) { this.scroll_y_boolean = checked },
+		change_scroll_x_boolean(checked : boolean) { this.scroll_x_boolean = checked },
+		confirm_upper_threshold_input(value : number) { this.upper_threshold_input = value },
+		confirm_lower_threshold_input(value : number) { this.lower_threshold_input = value },
+		confirm_scroll_top_input(value : number) { this.scroll_top_input = value },
+		confirm_scroll_left_input(value : number) { this.scroll_left_input = value },
+		confirm_refresher_background_input(value : string) { this.refresher_background_input = value }
 	}
 }
 </script>
 
 <template>
-	<!-- #ifdef APP -->
-	<scroll-view style="flex:1">
-	<!-- #endif -->
 	<view class="main">
-	<list-view :show-scrollbar="show_scrollbar_boolean" :bounces="bounces_boolean" :scrollable="scrollable_boolean" :refresher-enabled="refresher_enabled_boolean" :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" @scrolltolower="list_view_scrolltolower" style="width:100%;"><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</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" @scrolltolower="list_view_scrolltolower" @scroll="list_view_scroll" style="width:100%;"><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</text></list-item><list-item @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>uni-app-x</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="开启自定义下拉刷新" @change="change_refresher_enabled_boolean"></boolean-data>
-		<boolean-data :defaultValue="true" title="是否允许List滚动" @change="change_scrollable_boolean"></boolean-data>
-		<boolean-data :defaultValue="true" title="控制是否回弹效果" @change="change_bounces_boolean"></boolean-data>
+		<boolean-data :defaultValue="false" title="在设置滚动条位置时使用动画过渡" @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="false" 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="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="设置自定义下拉刷新区域背景颜色。默认'#FFF'" type="text" @confirm="confirm_refresher_background_input"></input-data>
 	</view>
 	<!-- #ifdef APP -->
 	</scroll-view>