更新记录
1.0.2(2023-05-11)
下载此版本
1.0.1(2023-05-11)
下载此版本
1.0.0(2023-05-11)
下载此版本
查看更多
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 3.7.0 |
× |
√ |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
√ |
√ |
√ |
√ |
√ |
× |
√ |
√ |
√ |
jc-pager 分页
自定义加载更多
使用
// import { onReachBottom } from '@dcloudio/uni-app'
// 默认reachToLowerEvent使用的是onReachBottom,可以自定义
function promise() {
// return Promise.resolve({data: {count: 0, list: []}})
// return Promise.reject({message: '这里是错误信息'})
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve({
data: {
count: 100,
list: new Array(20).fill(0).map(d => Math.random())
}
})
}, 1000)
})
}
<jc-pager :promise="promise" :autoLoad="true">
<template #default="{list, total, loading, done, error}">
<view class="p-4 m-1 bg-white" v-for="d, i in list" :key="i">
[{{i + 1}}] : {{d}}
</view>
</template>
</jc-pager>
props
参数 |
类型 |
默认值 |
说明 |
promise |
Function |
- |
Promise |
params |
Object |
{} |
request参数 |
autoLoad |
Boolean |
false |
自动加载首屏数据 |
reachToLowerEvent |
Function |
- |
自定义触底事件 |
listDataName |
String |
data.list |
列表数据字段名称 |
listRecordName |
String |
data.count |
记录总数数据字段名称 |
pageName |
String |
page |
分页名称 |
page |
Number |
1 |
开始页数 |
limitName |
String |
limit |
每页条数名称 |
limit |
Number |
20 |
每页返回数量 |
slot
名称 |
scope |
说明 |
default |
{list,total,loading,done,error} |
- |
error |
- |
错误 |
loading |
- |
加载中 |
done |
- |
加载完毕 |
empty |
- |
空 |
emit
事件名称 |
说明 |
onReachToLower |
触底时触发 |
expose
名称 |
类型 |
说明 |
init |
Function |
获取数据 |
reset |
Function |
reset |
重置 |