更新记录

1.0.2（2024-07-31） 下载此版本

文档更新

1.0.1（2024-07-31） 下载此版本

文档更新

1.0.0（2024-07-31） 下载此版本

发布

平台兼容性

uni-app

uni-app x

mosowe-page-list

uniapp/uni_modules组件

::: tip

1. 页面需设置："enablePullDownRefresh": true
2. 上拉加载需要在父组件中显示调用一下：onReachBottom(() => {})
3. 如需手动刷新，可调用uni.startPullDownRefresh()刷新
4. 接口返回的data中的数据格式应为{list,total}，如不是需要自行处理后再返回给requestData
   :::

兼容性

props

slots

expose

示例代码

<template>
  <mosowe-page-list :requestData="getData">
    <!-- 固定顶部栏 -->
    <template #top>
      <view style="height: 200rpx; background-color: #fff">top</view>
    </template>
    <!-- 固定底部栏 -->
    <template #bottom>
      <view
        style="height: 200rpx; background-color: #fff"
        @click="refresh">
        点击bottom刷新
      </view>
    </template>
    <!-- 列表数据 -->
    <template #default="{ item }">
      <view class="item">{{ item.name }}</view>
    </template>
  </mosowe-page-list>
</template>

<script setup lang="ts">
import { onReachBottom } from '@dcloudio/uni-app';
onReachBottom(() => {});
const getData = (params) => {
  return new Promise<any>((resolve, reject) => {
    setTimeout(() => {
      resolve({
        list: Array.from({ length: params.pageSize }).map((item: any, index: number) => {
          return { name: '哈哈哈' + ((params.pageNum - 1) * params.pageSize + index) };
        }),
        total: 60
      });
    }, 1000);
  });
};
const refresh = () => {
  uni.startPullDownRefresh();
};
</script>

<style lang="scss" scoped>
.item {
  height: 100rpx;
}
</style>