Hi-kits

PullToRefresh 拉动刷新

8/25/2022 操作移动端

用于提供下拉刷新的交互操作。

# 何时使用

import { HiPullToRefresh } from 'hi-kits/pullToRefresh'
1

# 基本用法

<h-pull-refresh style="background-color:#eee ; width: 100%; height:100px;">
</h-pull-refresh>
1
2
Expand Copy

# 下拉列表刷新

content content content content 
<h-pull-refresh>
    <h-list>
        <h-list-item>
            content
        </h-list-item>
        <h-list-item>
            content
        </h-list-item>
        <h-list-item>
            content
            <h-list-item-action>
            <h-tips tips="some tips" type="success">
                <h-tag noBorder color="#3F51B5" text="有提醒的标签"></h-tag>
            </h-tips>
            <h-tag noBorder style="color: #FFF; background-color: #31d100fd; " text="333"></h-tag>
            </h-list-item-action>
        </h-list-item>
        <h-list-item>
            content
            <h-list-item-action>
            <h-tag noBorder style="color: #FFF; background-color: #01bffd; " text="333"></h-tag>
            </h-list-item-action>
        </h-list-item>
    </h-list>
</h-pull-refresh>
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
Expand Copy

# 参数说明

参数 说明 类型 可选值 默认值
distance 触发距离 number - 44
Last Updated: 3/6/2023, 17:51:50

Swipeout 滑动操作