mx-refresh

mx-refresh 刷新

介绍

mx-refresh 实现了基本的下拉刷新、上拉加载更多功能。

使用方式

import '../../components/mx-refresh/mx-refresh.stml'

代码示例

下拉刷新

<mx-refresh refreshing={refreshingHeader} @refreshing="onRefreshingHeader"></mx-refresh>

上拉加载更多

<mx-refresh type="footer" refreshing={refreshingFooter} @refreshing="onRefreshingFooter"></mx-refresh>

API

props 属性

属性名称 说明 类型 默认值
type 指定刷新组件为下拉刷新或上拉加载,取值范围 header、footer string header
img-arrow 箭头图标路径 string 内置图标
img-loading 刷新状态时加载图标路径 string 内置图标
background 背景颜色 string -
text-color 文字颜色 string #000
text-normal 拖动时达到刷新阈值之前状态的文字描述 string 下拉时为“下拉可以刷新”,上拉时为“上拉可以加载”
text-dragging 拖动时达到刷新阈值之后状态的文字描述 string 下拉时为“松开可以刷新”,上拉时为“松开可以加载”
text-refreshing 刷新中状态的文字描述 string 下拉时为“刷新中...”,上拉时为“加载中...”
refreshing 设置是否进入刷新状态 boolean false

events 事件

事件名 说明 回调参数
refreshing 进入刷新状态时触发 -
是否仍需要帮助? 请保持联络!
最后更新于 2024/02/22