更新记录
1.0.1(2024-11-28)
下载此版本
1.0.0(2024-11-28)
下载此版本
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 3.1.0 app-vue |
× |
√ |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
xzg-paging
引入与使用
插件已支持uni_modules,无需引入直接使用即可。
<xzg-paging ref="paging" @query="getDataList" :limit="20" isPullRefresh>
<!-- item为您自己的数据属性,本例中为示例数据 -->
<template #default="{ item, index }">
<view class="item" @click="toD(item)">
<up-image width="164rpx" height="164rpx" radius="10rpx" :src="item.image_input" />
<view>
<view class="title">{{ item.title }}</view>
<view class="subTitle">{{ item.synopsis }}</view>
</view>
</view>
</template>
</xzg-paging>
const paging = ref()
/** 作者使用的typescript,如您使用的是javascript,请将: { page: number, limit: number }删除即可 */
const getDataList = async ({ page, limit }: { page: number, limit: number }) => {
const param = { page, limit }
const { data } = await IndexNoc(param)
paging.value.concat(data)
}
api
props
属性名 |
类型 |
默认值 |
说明 |
limit |
Number |
20 |
分页长度 |
isPullRefresh |
boolean |
false |
是否开启下拉刷新 |
isFixedTop |
boolean |
true |
是否将top固定顶部 |
height |
string |
200rpx |
组件高度,支持calc计算 |
methods
属性名 |
说明 |
concat |
合并数据,如例子中示范,请求完毕后需要将数组进行concat |
reload |
点击右侧菜单项时触发 |
slot
属性名 |
说明 |
top |
顶部插槽,一般用来放置一些查询条件 |
default |
默认插槽,用来定义您的行数据 |
empty |
内容为空时显示 |
loadMore |
下滑加载更多插槽 |
loading |
下滑加载中插槽 |
notMore |
无更多数据插槽 |
Tips
目前插件还在改进中...各位可以提出需求,联系作者QQ 1359859140