List 长列表

显示列表数据，支持配置下拉刷新、加载更多等功能。

支持平台

安卓	ios	web	微信小程序	支付宝小程序	QQ小程序
√	√	√	x	x	x

示例

<template>
	<t-page title="长列表" class='p.30'>
		<t-card class="mb.30" title="listview封装,主要解决list-view不支持web端不支持自定义下拉刷新"></t-card>
		<t-list class="h.1000-tdr-tdb" :refresher-enabled="true" :refresher="true" :loader="true">
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表1</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表2</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表3</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表4</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表5</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表6</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表7</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表8</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表9</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表10</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.150">
				<t-col>
					<t-text>测试列表11</t-text>
				</t-col>
			</t-list-item>
			<t-list-item class="h.500">
				<t-col>
					<t-text>测试列表12</t-text>
				</t-col>
			</t-list-item>
		</t-list>
	</t-page>
</template>

<script setup>

</script>

Props

名称	描述	类型	默认值
refresher	是否启用下拉刷新功能	Boolean	true
refresherClass	下拉刷新区域的额外类名	String	''
loader	是否启用加载更多功能	Boolean	true
loaderClass	加载更多区域的额外类名	String	''
refreshHeight	下拉刷新的高度阈值	String	'200'
refreshClass	下拉刷新区域的类名	String	''
loaderClass	加载更多区域的类名	String	''

Events

事件名	描述	回调参数
refresherrestore	下拉刷新恢复时触发	UniRefresherEvent
refresherrefresh	下拉刷新时触发	UniRefresherEvent
refresherpulling	下拉刷新过程中触发	UniRefresherEvent
scrolltolower	滚动到底部时触发	UniScrollToLowerEvent

Slots

名称	描述
-	-

Methods

名称	描述	参数
setLoadmoreState	设置加载更多状态	state: string
closerefresher	关闭下拉刷新	-