list-view-autotest.uvue 12.2 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42
<script>

export default {
	data() {
		return {
			refresher_triggered_boolean: false,
			refresher_enabled_boolean: false,
			scrollable_boolean: true,
			bounces_boolean: true,
			show_scrollbar_boolean: true
		}
	},
	methods: {
		list_view_click() { console.log("组件被点击时触发") },
		list_view_touchstart() { console.log("手指触摸动作开始") },
		list_view_touchmove() { console.log("手指触摸后移动") },
		list_view_touchcancel() { console.log("手指触摸动作被打断,如来电提醒,弹窗") },
		list_view_touchend() { console.log("手指触摸动作结束") },
		list_view_tap() { console.log("手指触摸后马上离开") },
		list_view_longpress() { console.log("如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。") },
		list_view_refresherpulling() { console.log("自定义下拉刷新控件被下拉") },
		list_view_refresherrefresh() { console.log("自定义下拉刷新被触发") },
		list_view_refresherrestore() { console.log("自定义下拉刷新被复位") },
		list_view_refresherabort() { console.log("自定义下拉刷新被中止") },
		list_view_scrolltolower() { console.log("滚动到底部触发") },
		list_item_click() { console.log("组件被点击时触发") },
		list_item_touchstart() { console.log("手指触摸动作开始") },
		list_item_touchmove() { console.log("手指触摸后移动") },
		list_item_touchcancel() { console.log("手指触摸动作被打断,如来电提醒,弹窗") },
		list_item_touchend() { console.log("手指触摸动作结束") },
		list_item_tap() { console.log("手指触摸后马上离开") },
		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 }
	}
}
</script>

<template>
43 44 45
	<!-- #ifdef APP -->
	<scroll-view style="flex:1">
	<!-- #endif -->
46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77
	<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>
	</view>

	<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="true" title="控制是否出现滚动条" @change="change_show_scrollbar_boolean"></boolean-data>
	</view>
	<!-- #ifdef APP -->
	</scroll-view>
	<!-- #endif -->
</template>

<style>
.main {
	max-height: 500rpx;
	padding: 10rpx 0;
	border-bottom: 1px solid rgba(0,0,0,.06);
	flex-direction: row;
	justify-content: center;
}

.main .list-item {
	width:100%;
	height:200rpx;
	border: 1px solid #666;
}

</style>