From 3b03f87a02458f719e2eb4bf112a13441b427d14 Mon Sep 17 00:00:00 2001
From: ‘chensiAb’ <‘chenchenco03@163.com’>
Date: Tue, 25 Mar 2025 13:54:34 +0800
Subject: [PATCH] Merge branch 'master' of ssh://dev.zhiheiot.com:29418/mob-components
---
_cursor.ai/plugins.doc/infiniteScroll.doc/CInfiniteScroll.doc.md | 91 +++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 91 insertions(+), 0 deletions(-)
diff --git a/_cursor.ai/plugins.doc/infiniteScroll.doc/CInfiniteScroll.doc.md b/_cursor.ai/plugins.doc/infiniteScroll.doc/CInfiniteScroll.doc.md
new file mode 100644
index 0000000..42f04ea
--- /dev/null
+++ b/_cursor.ai/plugins.doc/infiniteScroll.doc/CInfiniteScroll.doc.md
@@ -0,0 +1,91 @@
+# CInfiniteScroll 无限滚动组件
+
+## 功能说明
+
+该组件实现了移动端常见的下拉刷新和上拉加载更多功能，支持自动加载第一页和手动触发加载，适用于列表展示场景。内置了加载状态、空数据状态和加载完成状态的显示，使用简单便捷。
+
+## 引用方式
+
+```js
+import { CInfiniteScroll } from '@components/plugins/infiniteScroll';
+```
+
+## 组件参数
+
+- `autoInit` (Boolean，默认值：false)：是否自动初始化（自动加载第一页）
+- `onLoadMore` (Function，必填)：发起加载页面数据的回调函数
+ - `current` (Number)：当前页页码
+ - `next` (Number)：需要加载的页面页码
+ - `success` (Function)：当加载成功后调用
+ - 参数：`{ pageTotal: Number }` 总页数
+ - `fail` (Function)：加载失败后调用
+
+## 实例方法
+
+- `$initScroll`：初始化加载第一页数据
+- `$refresh`：重置并刷新数据
+ - `autoStart` (String，可选)：当值为 'off' 时不会自动加载，其他值或不传时会立即加载
+
+## 使用示例
+
+### 基础用法
+
+```html
+<template>
+ <view class="page">
+ <CInfiniteScroll
+ ref="scrollList"
+ :autoInit="true"
+ :onLoadMore="handleLoadMore"
+ >
+ <view class="list-item" v-for="(item, index) in list" :key="index">
+ {{ item.name }}
+ </view>
+ </CInfiniteScroll>
+ </view>
+</template>
+
+<script>
+import { CInfiniteScroll } from '@components/plugins/infiniteScroll';
+import { $fetchCommon } from '@fetchers/FCommon';
+
+export default {
+ components: {
+ CInfiniteScroll
+ },
+ data() {
+ return {
+ list: []
+ }
+ },
+ methods: {
+ handleLoadMore({ current, next, success, fail }) {
+ $fetchCommon.getList({ page: next }).then(res => {
+ // 拼接数据
+ if (current === 0) {
+ this.list = res.list;
+ } else {
+ this.list = this.list.concat(res.list);
+ }
+ success({
+ pageTotal: res.pageTotal
+ });
+ }).catch(() => {
+ fail();
+ });
+ },
+ // 手动刷新列表
+ refreshList() {
+ this.$refs.scrollList.$refresh();
+ }
+ }
+}
+</script>
+```
+
+## 注意事项
+
+- 组件通过检测滚动位置自动触发加载更多功能
+- 下拉刷新功能仅在滚动到顶部时可用
+- 加载状态会自动管理，包括"加载中"、"没有更多了"和"暂无数据"等提示
+- 组件内部对 H5 和小程序环境做了适配，在不同平台上使用相同的 API 即可
\ No newline at end of file
--
Gitblit v1.9.1