Refresher (下拉刷新)

下拉刷新 和 上拉加载

支持平台

安卓	ios	鸿蒙	web	微信小程序
√	√	√	√	√

示例代码

<template>
	<t-page title="Refresher" main-class='p-30'>
		<t-card title="Refresher 刷新-加载" main-class="mb-30" sub-title="下拉刷新 和 上拉加载"></t-card>
		<t-section title="基础功能+主题展示" main-class="mb-30"></t-section>
		<t-row main-class="fc tdr tdb tdp mb-30">
			<t-refresher type="p" default-icon-main-class="mr-5 s-35"></t-refresher>
		</t-row>
		<t-row main-class="fc tdr tdb tdp mb-30">
			<t-refresher type="error" default-icon-main-class="mr-5-s-35"></t-refresher>
		</t-row>
		<t-section title="布局方向调整" main-class="mb-30"></t-section>
		<t-row main-class="fc tdr tdb tdp mb-30">
			<t-refresher type="p" :vertical="false"></t-refresher>
		</t-row>
		<t-row main-class="fc tdr tdb tdp mb-30">
			<t-refresher type="error" :vertical="false"></t-refresher>
		</t-row>

		<t-section title="状态" main-class="mb-30"></t-section>
		<t-row main-class="fc tdr tdb tdp mb-30">
			<t-refresher type="p" :state="0"></t-refresher>
		</t-row>
		<t-row main-class="fc tdr tdb tdp mb-30">
			<t-refresher type="p" :state="1"></t-refresher>
		</t-row>
		<t-row main-class="fc tdr tdb tdp mb-30">
			<t-refresher type="p" :state="2"></t-refresher>
		</t-row>
		<t-row main-class="fc tdr tdb tdp mb-30">
			<t-refresher type="p" :state="3"></t-refresher>
		</t-row>
	</t-page>
</template>

属性

名称	类型	默认值	说明	可选值
size	String	mini	组件尺寸	large(大尺寸), medium(中尺寸), small(小尺寸), mini(迷你)
type	String	""	组件类型	info(信息), primary(正常), error(错误), warning(警告), success(成功)
disabled	Boolean	false	组件是否禁用	false, true
stop	Boolean	false	是否阻止事件冒泡（Tui统一写法处理事件冒泡）	false, true
hover	Boolean	true	是否有点击效果	false, true
path	String	""	点击组件后跳转的页面路径，如果为空则响应点击事件，如果不为空则跳转页面不会响应单击事件。	-
mainClass	String	""	组件根节点的样式	-
nativeClass	String	""	组件根节点原生样式	-
effect	String	"normal"	组件显示主题	normal(正常), dark(深色), light(浅色), plain(镂空)
defaultIcon	String	arrow-down-circle	默认状态时的图标
pullingIcon	String	arrow-up-circle	下拉刷新时的图标
refreshingEndIcon	String	checkbox-mark	刷新完成状态下的图标，默认为'checkbox-mark'
textClass	String	``	文本的样式
vertical	Boolean	true	是否纵向排列
iconClass	String	``	图标样式
refreshingIcon	String	spinner	刷新状态下的图标，默认为'spinner'
pullingText	String	松开立即刷新	下拉状态下的文本，默认为'松开立即刷新'
refreshingEndText	String	刷新成功	新完成状态下的文本，默认为'刷新成功'
state	Number	1	表示当前刷新状态	0: 默认状态 1: 下拉时候的状态 2: 下拉到设置的距离后的状态 3: 松开时的状态 4: 松开后执行操作成功状态
defaultText	String	继续下拉刷新	默认状态下的文本，默认为'继续下拉刷新'
refreshingText	String	正在刷新	刷新状态下的文本，默认为'正在刷新'

事件

名称	返回参数	说明
click	(e : UniPointerEvent)	-