diff --git a/.cursor/rules/important.mdc b/.cursor/rules/important.mdc
new file mode 100644
index 0000000..a064c37
--- /dev/null
+++ b/.cursor/rules/important.mdc
@@ -0,0 +1,11 @@
+---
+alwaysApply: true
+---
+1、回复用中文
+2、不要修改用户需求之外的代码
+3、对于长代码，进行分批次修改，每次提交行数不要超过580行
+4、对于大型代码文件，使用search_replace工具比edit_file更可靠
+5、每次修改只处理一小部分代码(少于508行)
+6、精确定位需要修改的代码块
+7、将复杂修改拆分为多个简单的、独立的修改步骤
+8、对于新文件创建，可以先创建基本结构，再逐步添加功能
\ No newline at end of file
diff --git a/components.d.ts b/components.d.ts
deleted file mode 100644
index 060eda8..0000000
--- a/components.d.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-/* eslint-disable */
-// @ts-nocheck
-// Generated by unplugin-vue-components
-// Read more: https://github.com/vuejs/core/pull/3399
-// biome-ignore lint: disable
-export {}
-
-/* prettier-ignore */
-declare module 'vue' {
-  export interface GlobalComponents {
-    HomeGoodsItem: typeof import('./components/guyu-home-container/home-goods-item.vue')['default']
-    HomeNotice: typeof import('./components/guyu-home-container/home-notice.vue')['default']
-    HomeRecommend: typeof import('./components/guyu-home-container/home-recommend.vue')['default']
-    HomeSearch: typeof import('./components/guyu-home-container/home-search.vue')['default']
-    HomeSwiper: typeof import('./components/guyu-home-container/home-swiper.vue')['default']
-    RouterLink: typeof import('vue-router')['RouterLink']
-    RouterView: typeof import('vue-router')['RouterView']
-    ZPaging: typeof import('./components/z-paging/z-paging.vue')['default']
-    ZPagingCell: typeof import('./components/z-paging-cell/z-paging-cell.vue')['default']
-    ZPagingEmptyView: typeof import('./components/z-paging-empty-view/z-paging-empty-view.vue')['default']
-    ZPagingLoadMore: typeof import('./components/z-paging/components/z-paging-load-more.vue')['default']
-    ZPagingRefresh: typeof import('./components/z-paging/components/z-paging-refresh.vue')['default']
-    ZPagingSwiper: typeof import('./components/z-paging-swiper/z-paging-swiper.vue')['default']
-    ZPagingSwiperItem: typeof import('./components/z-paging-swiper-item/z-paging-swiper-item.vue')['default']
-    ZTabs: typeof import('./components/z-tabs/z-tabs.vue')['default']
-  }
-}
diff --git a/components/guyu/home/container.vue b/components/guyu/home/container.vue
new file mode 100644
index 0000000..e69de29
diff --git a/components/guyu-home-container/home-goods-item.vue b/components/guyu/home/goods-item.vue
similarity index 100%
rename from components/guyu-home-container/home-goods-item.vue
rename to components/guyu/home/goods-item.vue
diff --git a/components/guyu/home/goods-list.vue b/components/guyu/home/goods-list.vue
new file mode 100644
index 0000000..4b3c87d
--- /dev/null
+++ b/components/guyu/home/goods-list.vue
@@ -0,0 +1,168 @@
+<!-- 在这个文件对每个tab对应的列表进行渲染 -->
+<template>
+    <view class="content">
+        <!-- 这里设置了z-paging加载时禁止自动调用reload方法，自行控制何时reload（懒加载）-->
+        <z-paging ref="paging" v-model="dataList" @query="queryList" use-page-scroll :scrollable="false"
+            :hide-empty-view="hideEmptyView" :refresher-enabled="false" @contentHeightChanged="contentHeightChanged"
+            :auto="false" :auto-clean-list-when-reload="false">
+            <!-- 如果希望其他view跟着页面滚动，可以放在z-paging标签内 -->
+            <view class="grid-container">
+                <view v-for="(item, index) in dataList" :key="index">
+                    <guyu-home-goods-item :goods-item="item" />
+                    <!-- <view class="item-title">{{ item.title }}</view>
+                    <view class="item-detail">{{ item.detail }}</view>
+                    <view class="item-line"></view> -->
+                </view>
+            </view>
+
+        </z-paging>
+    </view>
+</template>
+
+<script setup>
+import { ref, watch, nextTick, defineProps, defineExpose } from 'vue';
+
+// 定义props
+const props = defineProps({
+    // 当前组件的index，也就是当前组件是swiper中的第几个
+    tabIndex: {
+        type: Number,
+        default: 0
+    },
+    // 当前swiper切换到第几个index
+    currentIndex: {
+        type: Number,
+        default: 0
+    }
+});
+
+// 定义emit
+const emit = defineEmits(['heightChanged']);
+
+// 响应式数据
+// v-model绑定的这个变量不要在分页请求结束中自己赋值！！！
+const dataList = ref([]);
+const height = ref(0);
+const hideEmptyView = ref(true);
+const completeFunc = ref(null);
+const paging = ref(null);
+
+// 监听currentIndex变化
+watch(
+    () => props.currentIndex,
+    (newVal) => {
+        if (newVal === props.tabIndex) {
+            // 懒加载，当滑动到当前的item时，才去加载
+            nextTick(() => {
+                setTimeout(() => {
+                    paging.value.reload();
+                }, 100);
+            });
+        }
+    },
+    { immediate: true }
+);
+
+// 组件方法
+// 组件加载时会自动触发此方法，因此默认页面加载时会自动触发，无需手动调用
+const queryList = (pageNo, pageSize) => {
+    // 这里的pageNo和pageSize会自动计算好，直接传给服务器即可
+    // 模拟请求服务器获取分页数据，请替换成自己的网络请求
+    const params = {
+        pageNo: pageNo,
+        pageSize: pageSize,
+        type: props.tabIndex + 1
+    }
+    let c = [];
+    for (let i = 0; i < 10; i++) {
+        c.push({
+            title: '测试' + i,
+            detail: '详情' + i
+        })
+    }
+    paging.value.complete(c);
+    hideEmptyView.value = false;
+    //请求结束，调用父组件的下拉刷新结束回调函数，使得父组件中的z-paging下拉刷新结束
+    if (completeFunc.value) {
+        completeFunc.value();
+    }
+};
+
+// 页面通知当前子组件刷新列表
+const reload = (completeFn) => {
+    // 先把父组件下拉刷新的回调函数存起来
+    completeFunc.value = completeFn;
+    // 调用z-paging的reload方法
+    paging.value.reload();
+};
+
+// 当列表高度改变时，通知页面的swiper同步更改高度
+const contentHeightChanged = (height) => {
+    const finalHeight = dataList.value.length ? height : 0;
+    // 限制内容最小高度为屏幕可见高度减z-tabs高度。注意，页面中有使用slot="top"插入的view，则此处的minHeight还应该减去slot="top"插入的view的高度
+    const minHeight = uni.getSystemInfoSync().windowHeight - uni.upx2px(80);
+    emit('heightChanged', Math.max(finalHeight, minHeight));
+};
+
+// 页面通知当前子组件加载更多数据
+const doLoadMore = () => {
+    paging.value.doLoadMore();
+};
+
+// 页面通知当前子组件清除数据
+const clear = () => {
+    paging.value.clear();
+    hideEmptyView.value = true;
+};
+
+// 将方法暴露给父组件
+defineExpose({
+    reload,
+    doLoadMore,
+    clear
+});
+</script>
+
+<style>
+/* 注意，1、父节点需要固定高度，z-paging的height:100%才会生效 */
+/* 注意，2、请确保z-paging与同级的其他view的总高度不得超过屏幕宽度，以避免超出屏幕高度时页面的滚动与z-paging内部的滚动冲突 */
+.content {
+    height: 100%;
+}
+
+.item {
+    position: relative;
+    height: 150rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0rpx 30rpx;
+}
+
+.item-detail {
+    padding: 5rpx 15rpx;
+    border-radius: 10rpx;
+    font-size: 28rpx;
+    color: white;
+    background-color: #007AFF;
+}
+
+.item-line {
+    position: absolute;
+    bottom: 0rpx;
+    left: 0rpx;
+    height: 1px;
+    width: 100%;
+    background-color: #eeeeee;
+}
+
+.grid-container {
+    width: 100%;
+    display: grid;
+    /* 3列等宽 */
+    grid-template-columns: repeat(2, 1fr);
+    /* 间距 */
+    gap: 20rpx;
+    padding: 20rpx 0rpx;
+}
+</style>
diff --git a/components/guyu-home-container/home-notice.vue b/components/guyu/home/notice.vue
similarity index 100%
rename from components/guyu-home-container/home-notice.vue
rename to components/guyu/home/notice.vue
diff --git a/components/guyu-home-container/home-recommend.vue b/components/guyu/home/recommend.vue
similarity index 100%
rename from components/guyu-home-container/home-recommend.vue
rename to components/guyu/home/recommend.vue
diff --git a/components/guyu-home-container/home-search.vue b/components/guyu/home/search.vue
similarity index 100%
rename from components/guyu-home-container/home-search.vue
rename to components/guyu/home/search.vue
diff --git a/components/guyu-home-container/home-swiper.vue b/components/guyu/home/swiper.vue
similarity index 100%
rename from components/guyu-home-container/home-swiper.vue
rename to components/guyu/home/swiper.vue
diff --git a/components/guyu/home/tabs.vue b/components/guyu/home/tabs.vue
new file mode 100644
index 0000000..b838621
--- /dev/null
+++ b/components/guyu/home/tabs.vue
@@ -0,0 +1,192 @@
+<template>
+    <view class="tabs-container">
+        <view class="tabs-wrapper">
+            <template v-for="(item, index) in slideLableList" :key="index">
+                <view class="tab-item-wrapper" @click="clickTab(index)" :style="{ width: item.width }">
+                    <SlideLabel ref="slideLabels" :defaultColor="item.active ? '#F5D677' : '#fff'">
+                        <text class="tab-text myZt-500w">{{ item.name }}</text>
+                    </SlideLabel>
+                </view>
+            </template>
+        </view>
+    </view>
+</template>
+<script setup>
+import { onMounted, ref, watch, nextTick } from 'vue';
+import SlideLabel from '@/components/guyu/page/slide-label.vue';
+
+const props = defineProps({
+    list: {
+        type: Array,
+        default: () => []
+    },
+    current: {
+        type: Number,
+        default: 0
+    },
+});
+
+// 滑动方向：1表示向右滑，-1表示向左滑，0表示初始状态
+let slideDirection = ref(0);
+// 标签列表
+let slideLableList = ref([]);
+// 滑块组件引用
+let slideLabels = ref([]);
+
+// 初始化和更新slideLableList的函数
+const initSlideLableList = () => {
+    slideLableList.value = props.list.map((item, index) => {
+        return {
+            name: item.name,
+            width: getLableWidth(item.name),
+            active: index === props.current,
+            data: item
+        }
+    });
+
+    // 确保DOM更新后再操作SlideLabel实例
+    nextTick(() => {
+        updateLabelsState();
+    });
+}
+
+// 监听props.list的变化
+watch(() => props.list, () => {
+    initSlideLableList();
+}, { deep: true });
+
+// 监听current变化，处理标签切换
+watch(() => props.current, (newCurrent, oldCurrent) => {
+    if (newCurrent !== oldCurrent && slideLableList.value.length > 0) {
+        // 更新激活状态
+        slideLableList.value.forEach((item, index) => {
+            item.active = index === newCurrent;
+        });
+
+        // nextTick(() => {
+        //     updateLabelsState();
+        // });
+    }
+});
+
+// 更新所有标签状态
+const updateLabelsState = () => {
+    if (!slideLabels.value || slideLabels.value.length === 0) return;
+
+    // 重置所有标签状态
+    slideLabels.value.forEach((label, index) => {
+        if (label && label.reset) {
+            label.reset();
+        }
+    });
+}
+
+onMounted(() => {
+    initSlideLableList();
+})
+
+const getLableWidth = (name) => {
+    let t = name.length * 20 + 40;
+    if (t < 80) {
+        t = 80;
+    }
+    return t + "rpx";
+}
+
+const systemWidth = parseInt(uni.getWindowInfo().screenWidth * 0.96);
+const emit = defineEmits(['change']);
+let isClick = false;
+// 点击标签
+const clickTab = (index) => {
+    console.log('点击标签');
+    if (index == props.current) {
+        return;
+    }
+    isClick = true;
+    emit("change", index);
+}
+
+// 滑动效果处理函数
+const setDx = (dx) => {
+    if (!slideLabels.value || slideLabels.value.length === 0 || isClick) return;
+    // console.log('滑动处理了');
+
+    // 计算滑动百分比(0-100)
+    const absDx = Math.abs(dx);
+    const percent = Math.min(100, Math.round((absDx / systemWidth) * 100));
+
+    // 确定滑动方向
+    const direction = dx > 0 ? 1 : (dx < 0 ? -1 : 0);
+    slideDirection.value = direction;
+
+    const currentIndex = props.current;
+
+    if (direction > 0 && currentIndex + 1 < slideLableList.value.length) {
+        // 向右滑动 - 当前标签颜色消失，下一标签颜色出现
+        const nextIndex = currentIndex + 1;
+
+        // 当前标签从右侧被透明覆盖
+        slideLabels.value[currentIndex]?.coverFromLeft('#fff', percent);
+
+        // 下一个标签从左侧被颜色覆盖
+        slideLabels.value[nextIndex]?.coverFromLeft('#F5D677', percent);
+
+    } else if (direction < 0 && currentIndex > 0) {
+        // 向左滑动 - 当前标签颜色消失，前一标签颜色出现
+        const prevIndex = currentIndex - 1;
+
+        // 当前标签从左侧被透明覆盖
+        slideLabels.value[currentIndex]?.coverFromRight('#fff', percent);
+
+        // 前一个标签从右侧被颜色覆盖
+        slideLabels.value[prevIndex]?.coverFromRight('#F5D677', percent);
+    }
+}
+
+// 滑动结束，重置状态
+const unlockDx = () => {
+    slideDirection.value = 0;
+    if (isClick) {
+        isClick = false;
+    }
+    // 更新所有标签状态
+    nextTick(() => {
+        updateLabelsState();
+
+        // 确保当前选中的标签显示正确的颜色
+        slideLableList.value.forEach((item, index) => {
+            item.active = index === props.current;
+        });
+    });
+}
+
+// 暴露方法给父组件
+defineExpose({
+    setDx,
+    unlockDx
+});
+</script>
+<style lang="scss" scoped>
+.tabs-container {
+    width: 100%;
+}
+
+.tabs-wrapper {
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    margin-top: 32.64rpx;
+}
+
+.tab-item-wrapper {
+    min-width: 80rpx;
+    margin-right: 26.39rpx;
+    text-align: center;
+    line-height: 40rpx;
+    height: 50rpx;
+}
+
+.tab-text {
+    font-size: 22rpx;
+}
+</style>
\ No newline at end of file
diff --git a/components/guyu/page/slide-label.vue b/components/guyu/page/slide-label.vue
new file mode 100644
index 0000000..9b18e36
--- /dev/null
+++ b/components/guyu/page/slide-label.vue
@@ -0,0 +1,208 @@
+<template>
+    <view class="slide-label" :style="containerStyle">
+        <!-- 默认颜色背景 -->
+        <view class="color-bg default-color" :style="{ background: defaultColor }"></view>
+
+        <!-- 右侧覆盖颜色 -->
+        <view class="color-bg right-cover" :style="rightCoverStyle" v-if="showRightCover"></view>
+
+        <!-- 左侧覆盖颜色 -->
+        <view class="color-bg left-cover" :style="leftCoverStyle" v-if="showLeftCover"></view>
+
+        <!-- 内容层 -->
+        <view class="content-layer">
+            <slot>{{ content }}</slot>
+        </view>
+    </view>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue';
+
+// 定义组件属性
+const props = defineProps({
+    // 默认颜色
+    defaultColor: {
+        type: String,
+        default: '#FFFFFF'
+    },
+    // 显示文本
+    content: {
+        type: String,
+        default: ''
+    },
+    // 高度
+    height: {
+        type: [Number, String],
+        default: '45rpx'
+    },
+    // 圆角
+    borderRadius: {
+        type: [Number, String],
+        default: '25rpx'
+    },
+    // 文字颜色
+    textColor: {
+        type: String,
+        default: '#000000'
+    }
+});
+
+// 发出事件
+const emit = defineEmits(['coverChange']);
+
+// 右侧覆盖颜色状态
+const rightCoverColor = ref('');
+const rightCoverPercent = ref(0);
+const showRightCover = ref(false);
+
+// 左侧覆盖颜色状态
+const leftCoverColor = ref('');
+const leftCoverPercent = ref(0);
+const showLeftCover = ref(false);
+
+// 容器样式
+const containerStyle = computed(() => {
+    return {
+        height: typeof props.height === 'number' ? `${props.height}rpx` : props.height,
+        borderRadius: typeof props.borderRadius === 'number' ? `${props.borderRadius}rpx` : props.borderRadius,
+        color: props.textColor
+    };
+});
+
+// 右侧覆盖层样式
+const rightCoverStyle = computed(() => {
+    return {
+        background: rightCoverColor.value,
+        width: `${rightCoverPercent.value}%`,
+        right: 0
+    };
+});
+
+// 左侧覆盖层样式
+const leftCoverStyle = computed(() => {
+    return {
+        background: leftCoverColor.value,
+        width: `${leftCoverPercent.value}%`,
+        left: 0
+    };
+});
+
+/**
+ * 从右侧覆盖颜色
+ * @param {String} color 新颜色
+ * @param {Number} percent 覆盖百分比(0-100)
+ */
+function coverFromRight(color, percent = 0) {
+    // 确保百分比在有效范围内
+    const safePercent = Math.max(0, Math.min(100, percent));
+
+    // 设置覆盖颜色
+    rightCoverColor.value = color;
+    rightCoverPercent.value = safePercent;
+
+    // 显示覆盖层
+    showRightCover.value = safePercent > 0;
+
+    // 如果覆盖层宽度为0，隐藏它
+    if (safePercent === 0) {
+        showRightCover.value = false;
+    }
+
+    // 触发覆盖变化事件
+    emit('coverChange', {
+        direction: 'right',
+        color: color,
+        percent: safePercent
+    });
+}
+
+/**
+ * 从左侧覆盖颜色
+ * @param {String} color 新颜色
+ * @param {Number} percent 覆盖百分比(0-100)
+ */
+function coverFromLeft(color, percent = 0) {
+    // 确保百分比在有效范围内
+    const safePercent = Math.max(0, Math.min(100, percent));
+
+    // 设置覆盖颜色
+    leftCoverColor.value = color;
+    leftCoverPercent.value = safePercent;
+
+    // 显示覆盖层
+    showLeftCover.value = safePercent > 0;
+
+    // 如果覆盖层宽度为0，隐藏它
+    if (safePercent === 0) {
+        showLeftCover.value = false;
+    }
+
+    // 触发覆盖变化事件
+    emit('coverChange', {
+        direction: 'left',
+        color: color,
+        percent: safePercent
+    });
+}
+
+/**
+ * 重置所有覆盖层
+ */
+function reset() {
+    rightCoverPercent.value = 0;
+    leftCoverPercent.value = 0;
+    showRightCover.value = false;
+    showLeftCover.value = false;
+}
+
+// 暴露方法
+defineExpose({
+    coverFromRight,
+    coverFromLeft,
+    reset
+});
+</script>
+
+<style scoped>
+.slide-label {
+    position: relative;
+    width: 100%;
+    overflow: hidden;
+    border: 1rpx solid #9A8F79;
+}
+
+.color-bg {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    transition: width 0.3s ease-out;
+}
+
+.default-color {
+    width: 100%;
+    height: 100%;
+    left: 0;
+}
+
+.right-cover {
+    height: 100%;
+    top: 0;
+    /* border-radius: 25rpx; */
+}
+
+.left-cover {
+    height: 100%;
+    top: 0;
+}
+
+.content-layer {
+    position: relative;
+    z-index: 1;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+</style>
diff --git a/pages.json b/pages.json
index b3c3324..d34712b 100644
--- a/pages.json
+++ b/pages.json
@@ -1,4 +1,11 @@
 {
+	"easycom": {
+		"autoscan": true,
+		"custom": {
+			// 通用规则：匹配 guyu 下任意子目录的组件，格式 <目录名>-<组件名>
+			"^guyu-([a-z]+)-(.*)": "@/components/guyu/$1/$2.vue"
+		}
+	},
 	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
 		{
 			"path": "pages/index/index",
@@ -89,7 +96,8 @@
 		"selectedColor": "#333333",
 		"borderStyle": "black",
 		"height": "129.17rpx",
-		"list": [{
+		"list": [
+			{
 				"pagePath": "pages/home/home-page",
 				"iconPath": "/static/tabbar/ic_home.png",
 				"selectedIconPath": "/static/tabbar/ic_s.png"
diff --git a/pages/home/home-page.vue b/pages/home/home-page.vue
index 1de465f..a1771fe 100644
--- a/pages/home/home-page.vue
+++ b/pages/home/home-page.vue
@@ -1,176 +1,146 @@
+<!-- 滑动切换选项卡+吸顶演示(上一个tab数据不保留，滚动流畅) -->
 <template>
-	<view class="content">
-		<!-- 搜索 -->
-		<home-search style="width: 100%;" />
-		<!-- 公告 -->
-		<home-notice :notice-info="homeData?.noticeInfo" />
-		<!-- 轮播图 -->
-		<home-swiper :advert-list="homeData?.advertList" style="width: 100%;" />
-		<!-- 推荐位 -->
-		<home-recommend :rec-list="homeData?.recList" @item-click="toDetails" style="width: 100%;" />
+	<view>
+		<z-paging ref="pagePaging" refresher-only @onRefresh="onRefresh" @scrolltolower="scrolltolower"
+			@scroll="scroll">
+			<view class="content">
+				<guyu-home-search style="width: 100%;"></guyu-home-search>
+				<!-- 公告 -->
+				<guyu-home-notice :notice-info="homeData?.noticeInfo" />
+				<!-- 轮播图 -->
+				<guyu-home-swiper :advert-list="homeData?.advertList" style="width: 100%;" />
+				<!-- 推荐位 -->
+				<guyu-home-recommend :rec-list="homeData?.recList" style="width: 100%;" />
 
-		<!-- tab -->
-		<view class="" style="width: 100%; display: flex; flex-direction: row; margin-top: 32.64rpx;">
-			<view class="" v-for="(item, index) in homeData.categories" :key="index" @click="clickTab(index)"
-				:style="setTabBg(index)"
-				style="padding: 0 16.67rpx 6rpx 16.67rpx ; margin-right: 26.39rpx; border-radius: 50rpx;">
-				<text class="myZt-500w" style=" font-size: 23.61rpx;">{{ item.name }}</text>
+				<!-- 小程序中直接修改组件style为position: sticky;无效，需要在组件外层套一层view -->
+				<view class="bar-view" style="z-index:97;position: sticky;top :0;background-color: #fff;">
+					<view :style="{ height: tabsBarHeight + 'px' }" class="status-bar"> </view>
+					<guyu-home-tabs ref="tabs" :list="homeData?.categories" @change="tabsChange" :current="current" />
+				</view>
+				<swiper class="swiper" :style="[{ height: swiperHeight + 'px' }]" :current="current"
+					@transition="swiperTransition" @animationfinish="swiperAnimationfinish">
+					<swiper-item class="swiper-item" v-for="(item, index) in homeData?.categories" :key="index">
+						<guyu-home-goods-list ref="swiperList" :tabIndex="index" :currentIndex="current"
+							@heightChanged="heightChanged">
+						</guyu-home-goods-list>
+					</swiper-item>
+				</swiper>
 			</view>
-		</view>
-
-		<!-- 商品列表 -->
-		<view class="grid-container">
-			<home-goods-item v-for="(item, index) in goodsLsit" :key="index" :goods-item="item" />
-		</view>
+		</z-paging>
 	</view>
-
 </template>
 
 <script setup>
-	import {
-		ref,
-		reactive
-	} from 'vue';
-	import {
-		homeData,
-		isLoading,
-		error,
-		preloadHomeData,
-		refreshHomeData
-	} from '@/common/server/home';
-	import HomeSearch from '@/components/guyu-home-container/home-search.vue';
-	import HomeNotice from '@/components/guyu-home-container/home-notice.vue';
-	import HomeSwiper from '@/components/guyu-home-container/home-swiper.vue';
-	import HomeRecommend from '@/components/guyu-home-container/home-recommend.vue';
-	import HomeGoodsItem from '@/components/guyu-home-container/home-goods-item.vue';
+import { ref, onMounted } from 'vue';
+import {
+	homeData,
+	isLoading,
+	error,
+	preloadHomeData,
+	refreshHomeData
+} from '@/common/server/home';
+// 状态变量
+const swiperHeight = ref(0);
+const tabList = ref(['测试1', '测试2', '测试3', '测试4']);
+const current = ref(0); // tabs组件的current值，表示当前活动的tab选项
+const tabsBarHeight = ref(0);
+const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight);
+const isQuerying = ref(false);
 
+// 组件引用
+const pagePaging = ref(null);
+const tabs = ref(null);
+const swiperList = ref(null);
 
-	onLoad(() => {
+onLoad(() => {
 
-	});
-	// 初始化加载
-	onMounted(() => {
-		if (!homeData.value) preloadHomeData();
-	});
-	const currendIndex = ref(0);
-
-
-	const goodsLsit = reactive([{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常坂本日常坂本日常坂本日常坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
-		},
-		{
-			id: 1,
-			title: "坂本日常坂本日常坂本日常坂本日常",
-			imgUrl: "",
-			type: "",
-			price: "20"
+});
+// 初始化加载
+onMounted(() => {
+	if (!homeData.value) preloadHomeData();
+});
+// 方法
+const scroll = (e) => {
+	// #ifdef MP
+	if (e.detail.scrollTop < 700 && statusBarHeight.value > 0) {
+		if (isQuerying.value) {
+			return;
 		}
-	]);
-
-	// 方法
-	const clickTab = (index) => {
-		currendIndex.value = index;
-	};
-
-	const setTabBg = (index) => {
-		if (currendIndex.value == index) {
-			return {
-				backgroundColor: '#F5D677',
-				border: '1rpx solid transparent'
+		isQuerying.value = true;
+		const query = uni.createSelectorQuery();
+		query.select('.bar-view').boundingClientRect(rect => {
+			if (rect) {
+				// 判断元素是否粘滞
+				if (rect.top <= 0 && tabsBarHeight.value == 0) {
+					tabsBarHeight.value = statusBarHeight.value;
+				} else if (rect.top > 30 && statusBarHeight.value > 0) {
+					tabsBarHeight.value = 0;
+				}
 			}
-		} else {
-			return {
-				backgroundColor: 'transparent',
-				border: '1rpx solid #9A8F79'
-			}
-		}
-	};
+			isQuerying.value = false;
+		}).exec();
+	}
+	// #endif
+};
 
-	const toDetails = (id) => {
-		uni.navigateTo({
-			url: '/pages/home/product-details?id=' + id
-		});
-	};
+// tabs通知swiper切换
+const tabsChange = (index) => {
+	_setCurrent(index);
+};
+
+// 下拉刷新时，通知当前显示的列表进行reload操作
+const onRefresh = () => {
+	swiperList.value[current.value].reload(() => {
+		//当当前显示的列表刷新结束，结束当前页面的刷新状态
+		pagePaging.value.endRefresh();
+	});
+};
+
+// 当滚动到底部时，通知当前显示的列表加载更多
+const scrolltolower = () => {
+	swiperList.value[current.value].doLoadMore();
+};
+
+// swiper滑动中
+const swiperTransition = (e) => {
+	tabs.value.setDx(e.detail.dx);
+};
+
+// swiper滑动结束
+const swiperAnimationfinish = (e) => {
+	_setCurrent(e.detail.current);
+	tabs.value.unlockDx();
+};
+
+// 设置swiper的高度
+const heightChanged = (height) => {
+	if (height === 0) {
+		// 默认swiper高度为屏幕可用高度-tabsView高度-slot="top"内view的高度
+		// 注意：uni.upx2px(80)不是固定的，它等于slot="top"内view的高度，如果slot="top"内view的高度不为80rpx，则需要修改这个值
+		height = uni.getSystemInfoSync().windowHeight - uni.upx2px(80);
+	}
+	swiperHeight.value = height;
+};
+
+const _setCurrent = (currentVal) => {
+	if (currentVal !== current.value) {
+		//切换tab时，将上一个tab的数据清空
+		swiperList.value[current.value].clear();
+	}
+	current.value = currentVal;
+};
 </script>
 
-<style lang="scss">
-	.content {
-		width: 94%;
-		height: 100vh;
-		margin: 0 auto;
-		display: flex;
-		flex-direction: column;
-		position: relative;
-		align-items: center;
-	}
+<style lang="scss" scoped>
+.content {
+	width: 96%;
+	margin-left: 2%;
+	background-color: url('@@:static/bg.png');
+	background-size: 100% 100%;
+	background-repeat: no-repeat;
+}
 
-	.grid-container {
-		width: 100%;
-		display: grid;
-		/* 3列等宽 */
-		grid-template-columns: repeat(2, 1fr);
-		/* 间距 */
-		gap: 34.72rpx;
-		padding: 20rpx;
-	}
+.swiper {
+	height: 1000px;
+}
 </style>
\ No newline at end of file
diff --git a/uni_modules/z-paging/changelog.md b/uni_modules/z-paging/changelog.md
new file mode 100644
index 0000000..f21279f
--- /dev/null
+++ b/uni_modules/z-paging/changelog.md
@@ -0,0 +1,51 @@
+## 2.8.7（2025-05-30）
+1.`新增` props：`layout-only`，支持仅使用基础布局。  
+2.`新增` `goF2`方法，支持手动触发进入二楼。  
+3.`新增` `@scrollDirectionChange`事件，支持监听列表滚动方向改变。  
+4.`新增` props：`paging-class`，支持直接设置`z-paging`的`class`。  
+5.`新增` `addKeyboardHeightChangeListener`方法，支持手动添加键盘高度变化监听。  
+6.`修复` `scrollIntoViewById`方法在存在`slot=top`或局部区域滚动时，滚动的位置不准确的问题。  
+7.`优化` 重构底部安全区域处理逻辑，修改为占位view的方式，处理方案更灵活并支持自定义底部安全区域颜色。  
+8.`优化` 兼容在`nvue`+`vue3`中使用`waterfall`。  
+9.`优化` 规范`types`中对`style`类型的约束。  
+## 2.8.6（2025-03-17）
+1.`新增` 聊天记录模式流式输出（类似chatGPT回答）演示demo。  
+2.`新增` z-paging及其公共子组件支持`HBuilderX`代码文档提示。  
+3.`新增` props：`virtual-in-swiper-slot`，用以解决vue3+(微信小程序或QQ小程序)中，使用非内置列表写法时，若z-paging在`swiper-item`中存在的无法获取slot插入的cell高度进而导致虚拟列表失败的问题。  
+4.`新增` `@scrolltolower`和@`scrolltoupper`支持nvue。  
+5.`修复` 由`v2.8.1`引出的方法`scrollIntoViewById`在微信小程序+vue3中无效的问题。  
+6.`修复` 由`v2.8.1`引出的在子组件内使用z-paging虚拟列表无效的问题。  
+7.`修复` 在微信小程序中基础库版本较高时`wx.getSystemInfoSync is deprecated`警告。  
+8.`优化` 提升下拉刷新在鸿蒙Next中的性能。  
+9.`优化` `@scrolltolower`和`@scrolltoupper`在倒置的聊天记录模式下的触发逻辑。  
+10.`优化` 其他细节调整。  
+## 2.8.5（2025-02-09）
+1.`新增` 方法`scrollToX`，支持控制x轴滚动到指定位置。  
+2.`修复` 快手小程序中报错`await isn't allowed in non-async function`的问题。  
+3.`修复` 在iOS+nvue中，设置了`:loading-more-enabled="false"`后，调用`scrollToBottom`无法滚动到底部的问题。  
+4.`修复` 在支付宝小程序+页面滚动中，数据为空时空数据图未居中的问题。  
+5.`优化` fetch types修改。  
+## 2.8.4（2024-12-02）
+1.`修复` 在虚拟列表+vue2中，顶部占位采用transformY方案；在虚拟列表+vue3中，顶部占位采用view占位方案。以解决在vue2+微信小程序+安卓+兼容模式中，可能出现的虚拟列表闪动的问题。  
+2.`修复` 在列表渲染时（尤其是在虚拟列表中）偶现的【点击加载更多】闪现的问题。   
+3.`优化` 统一在RefresherStatus枚举中Loading取值。    
+4.`优化` `defaultPageNo`&`defaultPageSize`修改为只允许number类型。  
+5.`优化` 提升兼容性&细节优化。  
+## 2.8.3（2024-11-27）
+1.`修复` `doInsertVirtualListItem`插入数据无效的问题。  
+2.`优化` 提升兼容性&细节优化。  
+## 2.8.2（2024-11-25）
+1.`优化` types中`ZPagingRef`和`ZPagingInstance`支持泛型。  
+## 2.8.1（2024-11-24）
+1.`新增` 完整的`props`、`slots`、`methods`、`events`的typescript types声明，可在ts中获得绝佳的代码提示体验。  
+2.`新增` `virtual-cell-id-prefix`：虚拟列表cell id的前缀，适用于一个页面有多个虚拟列表的情况，用以区分不同虚拟列表cell的id。  
+3.`修复` 在vue3+(微信小程序或QQ小程序)中，使用非内置列表写法时，若`z-paging`在`swiper-item`标签内的情况下存在的无法获取slot插入的cell高度的问题。  
+4.`修复` 在虚拟列表中分页数据小于1页时插入新数据，虚拟列表未生效的问题。  
+5.`修复` 在虚拟列表中调用`refresh`时，cell的index计算不正确的问题。  
+6.`修复` 在快手小程序中内容较少或空数据时`z-paging`未能铺满全屏的问题。  
+7.`优化` `events`中的参数涉及枚举的部分，统一由之前的number类型修改为string类型，展示更直观！涉及的events：`@query`中的`from`参数；`@refresherStatusChange`中的`status`参数；`@loadingStatusChange`中的`status`参数；`slot=refresher`中的`refresherStatus`参数；`slot=chatLoading`中的`loadingMoreStatus`参数。更新版本请特别留意！  
+## 2.8.0（2024-10-21）
+1.`新增` 全面支持鸿蒙Next。  
+2.`修复` 设置了`refresher-complete-delay`后，在下拉刷新期间调用reload导致的无法再次下拉刷新的问题。  
+3.`优化` 废弃虚拟列表transformY顶部占位方案，修改为空view占位。解决因使用旧方案导致的vue3中可能出现的虚拟列表闪动问题。提升虚拟列表的兼容性。  
+
diff --git a/components/z-paging-cell/z-paging-cell.vue b/uni_modules/z-paging/components/z-paging-cell/z-paging-cell.vue
similarity index 100%
rename from components/z-paging-cell/z-paging-cell.vue
rename to uni_modules/z-paging/components/z-paging-cell/z-paging-cell.vue
diff --git a/components/z-paging-empty-view/z-paging-empty-view.vue b/uni_modules/z-paging/components/z-paging-empty-view/z-paging-empty-view.vue
similarity index 100%
rename from components/z-paging-empty-view/z-paging-empty-view.vue
rename to uni_modules/z-paging/components/z-paging-empty-view/z-paging-empty-view.vue
diff --git a/components/z-paging-swiper-item/z-paging-swiper-item.vue b/uni_modules/z-paging/components/z-paging-swiper-item/z-paging-swiper-item.vue
similarity index 100%
rename from components/z-paging-swiper-item/z-paging-swiper-item.vue
rename to uni_modules/z-paging/components/z-paging-swiper-item/z-paging-swiper-item.vue
diff --git a/components/z-paging-swiper/z-paging-swiper.vue b/uni_modules/z-paging/components/z-paging-swiper/z-paging-swiper.vue
similarity index 100%
rename from components/z-paging-swiper/z-paging-swiper.vue
rename to uni_modules/z-paging/components/z-paging-swiper/z-paging-swiper.vue
diff --git a/components/z-paging/components/z-paging-load-more.vue b/uni_modules/z-paging/components/z-paging/components/z-paging-load-more.vue
similarity index 100%
rename from components/z-paging/components/z-paging-load-more.vue
rename to uni_modules/z-paging/components/z-paging/components/z-paging-load-more.vue
diff --git a/components/z-paging/components/z-paging-refresh.vue b/uni_modules/z-paging/components/z-paging/components/z-paging-refresh.vue
similarity index 100%
rename from components/z-paging/components/z-paging-refresh.vue
rename to uni_modules/z-paging/components/z-paging/components/z-paging-refresh.vue
diff --git a/components/z-paging/config/index.js b/uni_modules/z-paging/components/z-paging/config/index.js
similarity index 100%
rename from components/z-paging/config/index.js
rename to uni_modules/z-paging/components/z-paging/config/index.js
diff --git a/components/z-paging/css/z-paging-main.css b/uni_modules/z-paging/components/z-paging/css/z-paging-main.css
similarity index 100%
rename from components/z-paging/css/z-paging-main.css
rename to uni_modules/z-paging/components/z-paging/css/z-paging-main.css
diff --git a/components/z-paging/css/z-paging-static.css b/uni_modules/z-paging/components/z-paging/css/z-paging-static.css
similarity index 100%
rename from components/z-paging/css/z-paging-static.css
rename to uni_modules/z-paging/components/z-paging/css/z-paging-static.css
diff --git a/components/z-paging/i18n/en.json b/uni_modules/z-paging/components/z-paging/i18n/en.json
similarity index 100%
rename from components/z-paging/i18n/en.json
rename to uni_modules/z-paging/components/z-paging/i18n/en.json
diff --git a/components/z-paging/i18n/index.js b/uni_modules/z-paging/components/z-paging/i18n/index.js
similarity index 100%
rename from components/z-paging/i18n/index.js
rename to uni_modules/z-paging/components/z-paging/i18n/index.js
diff --git a/components/z-paging/i18n/zh-Hans.json b/uni_modules/z-paging/components/z-paging/i18n/zh-Hans.json
similarity index 100%
rename from components/z-paging/i18n/zh-Hans.json
rename to uni_modules/z-paging/components/z-paging/i18n/zh-Hans.json
diff --git a/components/z-paging/i18n/zh-Hant.json b/uni_modules/z-paging/components/z-paging/i18n/zh-Hant.json
similarity index 100%
rename from components/z-paging/i18n/zh-Hant.json
rename to uni_modules/z-paging/components/z-paging/i18n/zh-Hant.json
diff --git a/components/z-paging/js/hooks/useZPaging.js b/uni_modules/z-paging/components/z-paging/js/hooks/useZPaging.js
similarity index 100%
rename from components/z-paging/js/hooks/useZPaging.js
rename to uni_modules/z-paging/components/z-paging/js/hooks/useZPaging.js
diff --git a/components/z-paging/js/hooks/useZPagingComp.js b/uni_modules/z-paging/components/z-paging/js/hooks/useZPagingComp.js
similarity index 100%
rename from components/z-paging/js/hooks/useZPagingComp.js
rename to uni_modules/z-paging/components/z-paging/js/hooks/useZPagingComp.js
diff --git a/components/z-paging/js/modules/back-to-top.js b/uni_modules/z-paging/components/z-paging/js/modules/back-to-top.js
similarity index 100%
rename from components/z-paging/js/modules/back-to-top.js
rename to uni_modules/z-paging/components/z-paging/js/modules/back-to-top.js
diff --git a/components/z-paging/js/modules/chat-record-mode.js b/uni_modules/z-paging/components/z-paging/js/modules/chat-record-mode.js
similarity index 100%
rename from components/z-paging/js/modules/chat-record-mode.js
rename to uni_modules/z-paging/components/z-paging/js/modules/chat-record-mode.js
diff --git a/components/z-paging/js/modules/common-layout.js b/uni_modules/z-paging/components/z-paging/js/modules/common-layout.js
similarity index 100%
rename from components/z-paging/js/modules/common-layout.js
rename to uni_modules/z-paging/components/z-paging/js/modules/common-layout.js
diff --git a/components/z-paging/js/modules/data-handle.js b/uni_modules/z-paging/components/z-paging/js/modules/data-handle.js
similarity index 100%
rename from components/z-paging/js/modules/data-handle.js
rename to uni_modules/z-paging/components/z-paging/js/modules/data-handle.js
diff --git a/components/z-paging/js/modules/empty.js b/uni_modules/z-paging/components/z-paging/js/modules/empty.js
similarity index 100%
rename from components/z-paging/js/modules/empty.js
rename to uni_modules/z-paging/components/z-paging/js/modules/empty.js
diff --git a/components/z-paging/js/modules/i18n.js b/uni_modules/z-paging/components/z-paging/js/modules/i18n.js
similarity index 100%
rename from components/z-paging/js/modules/i18n.js
rename to uni_modules/z-paging/components/z-paging/js/modules/i18n.js
diff --git a/components/z-paging/js/modules/load-more.js b/uni_modules/z-paging/components/z-paging/js/modules/load-more.js
similarity index 100%
rename from components/z-paging/js/modules/load-more.js
rename to uni_modules/z-paging/components/z-paging/js/modules/load-more.js
diff --git a/components/z-paging/js/modules/loading.js b/uni_modules/z-paging/components/z-paging/js/modules/loading.js
similarity index 100%
rename from components/z-paging/js/modules/loading.js
rename to uni_modules/z-paging/components/z-paging/js/modules/loading.js
diff --git a/components/z-paging/js/modules/nvue.js b/uni_modules/z-paging/components/z-paging/js/modules/nvue.js
similarity index 100%
rename from components/z-paging/js/modules/nvue.js
rename to uni_modules/z-paging/components/z-paging/js/modules/nvue.js
diff --git a/components/z-paging/js/modules/refresher.js b/uni_modules/z-paging/components/z-paging/js/modules/refresher.js
similarity index 100%
rename from components/z-paging/js/modules/refresher.js
rename to uni_modules/z-paging/components/z-paging/js/modules/refresher.js
diff --git a/components/z-paging/js/modules/scroller.js b/uni_modules/z-paging/components/z-paging/js/modules/scroller.js
similarity index 100%
rename from components/z-paging/js/modules/scroller.js
rename to uni_modules/z-paging/components/z-paging/js/modules/scroller.js
diff --git a/components/z-paging/js/modules/virtual-list.js b/uni_modules/z-paging/components/z-paging/js/modules/virtual-list.js
similarity index 100%
rename from components/z-paging/js/modules/virtual-list.js
rename to uni_modules/z-paging/components/z-paging/js/modules/virtual-list.js
diff --git a/components/z-paging/js/z-paging-constant.js b/uni_modules/z-paging/components/z-paging/js/z-paging-constant.js
similarity index 100%
rename from components/z-paging/js/z-paging-constant.js
rename to uni_modules/z-paging/components/z-paging/js/z-paging-constant.js
diff --git a/components/z-paging/js/z-paging-enum.js b/uni_modules/z-paging/components/z-paging/js/z-paging-enum.js
similarity index 100%
rename from components/z-paging/js/z-paging-enum.js
rename to uni_modules/z-paging/components/z-paging/js/z-paging-enum.js
diff --git a/components/z-paging/js/z-paging-interceptor.js b/uni_modules/z-paging/components/z-paging/js/z-paging-interceptor.js
similarity index 100%
rename from components/z-paging/js/z-paging-interceptor.js
rename to uni_modules/z-paging/components/z-paging/js/z-paging-interceptor.js
diff --git a/components/z-paging/js/z-paging-main.js b/uni_modules/z-paging/components/z-paging/js/z-paging-main.js
similarity index 100%
rename from components/z-paging/js/z-paging-main.js
rename to uni_modules/z-paging/components/z-paging/js/z-paging-main.js
diff --git a/components/z-paging/js/z-paging-mixin.js b/uni_modules/z-paging/components/z-paging/js/z-paging-mixin.js
similarity index 100%
rename from components/z-paging/js/z-paging-mixin.js
rename to uni_modules/z-paging/components/z-paging/js/z-paging-mixin.js
diff --git a/components/z-paging/js/z-paging-static.js b/uni_modules/z-paging/components/z-paging/js/z-paging-static.js
similarity index 100%
rename from components/z-paging/js/z-paging-static.js
rename to uni_modules/z-paging/components/z-paging/js/z-paging-static.js
diff --git a/components/z-paging/js/z-paging-utils.js b/uni_modules/z-paging/components/z-paging/js/z-paging-utils.js
similarity index 98%
rename from components/z-paging/js/z-paging-utils.js
rename to uni_modules/z-paging/components/z-paging/js/z-paging-utils.js
index f30b360..da1abf6 100644
--- a/components/z-paging/js/z-paging-utils.js
+++ b/uni_modules/z-paging/components/z-paging/js/z-paging-utils.js
@@ -140,9 +140,11 @@ function getSystemInfoSync(useCache = false) {
 	const infoTypes = ['DeviceInfo', 'AppBaseInfo', 'WindowInfo'];
 	const { deviceInfo, appBaseInfo, windowInfo } = infoTypes.reduce((acc, key) => {
 		const method = `get${key}`;
-		if (uni[method] && uni.canIUse(method)) {
-			acc[key.charAt(0).toLowerCase() + key.slice(1)] = uni[method]();
-		}
+		try{
+			if (uni[method] && uni.canIUse(method)) {
+				acc[key.charAt(0).toLowerCase() + key.slice(1)] = uni[method]();
+			}
+		}catch{}
 		return acc;
 	}, {});
 	// 如果deviceInfo、appBaseInfo和windowInfo都可以从各自专属的api中获取，则整合它们的数据
diff --git a/components/z-paging/wxs/z-paging-renderjs.js b/uni_modules/z-paging/components/z-paging/wxs/z-paging-renderjs.js
similarity index 100%
rename from components/z-paging/wxs/z-paging-renderjs.js
rename to uni_modules/z-paging/components/z-paging/wxs/z-paging-renderjs.js
diff --git a/components/z-paging/wxs/z-paging-wxs.wxs b/uni_modules/z-paging/components/z-paging/wxs/z-paging-wxs.wxs
similarity index 100%
rename from components/z-paging/wxs/z-paging-wxs.wxs
rename to uni_modules/z-paging/components/z-paging/wxs/z-paging-wxs.wxs
diff --git a/components/z-paging/z-paging.vue b/uni_modules/z-paging/components/z-paging/z-paging.vue
similarity index 100%
rename from components/z-paging/z-paging.vue
rename to uni_modules/z-paging/components/z-paging/z-paging.vue
diff --git a/uni_modules/z-paging/package.json b/uni_modules/z-paging/package.json
new file mode 100644
index 0000000..f3871a6
--- /dev/null
+++ b/uni_modules/z-paging/package.json
@@ -0,0 +1,89 @@
+{
+  "id": "z-paging",
+  "name": "z-paging",
+  "displayName": "【z-paging下拉刷新、上拉加载】高性能，全平台兼容。支持虚拟列表，分页全自动处理",
+  "version": "2.8.7",
+  "description": "超简单、低耦合！使用wxs+renderjs实现。支持自定义下拉刷新、上拉加载更多、虚拟列表、下拉进入二楼、自动管理空数据图、无闪动聊天分页、本地分页、国际化等数百项配置",
+  "keywords": [
+    "下拉刷新",
+    "上拉加载",
+    "分页器",
+    "nvue",
+    "虚拟列表"
+],
+  "repository": "https://github.com/SmileZXLee/uni-z-paging",
+  "engines": {
+    "HBuilderX": "^3.0.7"
+  },
+  "dcloudext": {
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": "393727164"
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/z-paging",
+    "type": "component-vue"
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y",
+        "alipay": "n"
+      },
+      "client": {
+        "App": {
+            "app-vue": "y",
+            "app-nvue": "y",
+            "app-harmony": "u",
+            "app-uvue": "u"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y",
+          "钉钉": "y",
+          "快手": "y",
+          "飞书": "y",
+          "京东": "y"
+        },
+        "快应用": {
+          "华为": "y",
+          "联盟": "y"
+        },
+        "Vue": {
+          "vue2": "y",
+          "vue3": "y"
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/uni_modules/z-paging/readme.md b/uni_modules/z-paging/readme.md
new file mode 100644
index 0000000..f6cbb4d
--- /dev/null
+++ b/uni_modules/z-paging/readme.md
@@ -0,0 +1,57 @@
+# z-paging
+
+<p align="center">
+    <img alt="logo" src="https://z-paging.zxlee.cn/img/title-logo.png" height="100" style="margin-bottom: 50px;" />
+</p>
+
+[![version](https://img.shields.io/badge/version-2.8.7-blue)](https://github.com/SmileZXLee/uni-z-paging) [![license](https://img.shields.io/github/license/SmileZXLee/uni-z-paging)](https://en.wikipedia.org/wiki/MIT_License)
+<img height="0" width="0" src="https://api.z-notify.zxlee.cn/v1/public/statistics/8293556910106066944/addOnly?from=uni" />
+
+`z-paging-x`现已支持uniapp x，持续完善中，插件地址👉🏻 [https://ext.dcloud.net.cn/plugin?name=z-paging-x](https://ext.dcloud.net.cn/plugin?name=z-paging-x)  
+
+### 文档地址：[https://z-paging.zxlee.cn](https://z-paging.zxlee.cn)
+
+### 更新组件前，请注意[版本差异](https://z-paging.zxlee.cn/start/upgrade-guide.html)
+
+***  
+### 功能&特点
+* 【配置简单】仅需两步（绑定网络请求方法、绑定分页结果数组）轻松完成完整下拉刷新，上拉加载更多功能。
+* 【低耦合，低侵入】分页自动管理。在page中无需处理任何分页相关逻辑，无需在data中定义任何分页相关变量，全由z-paging内部处理。
+* 【超灵活，支持各种类型自定义】支持自定义下拉刷新，自定义上拉加载更多等各种自定义效果；支持使用内置自动分页，同时也支持通过监听下拉刷新和滚动到底部事件自行处理；支持使用自带全屏布局规范，同时也支持将z-paging自由放在任意容器中。
+* 【功能丰富】支持国际化，支持自定义且自动管理空数据图，支持主题模式切换，支持本地分页，支持无闪动聊天分页模式，支持展示最后更新时间，支持吸顶效果，支持内部scroll-view滚动与页面滚动，支持一键滚动到顶部，支持下拉进入二楼等诸多功能。
+* 【【全平台兼容】支持vue&nvue，vue2&vue3，js&ts，支持h5、app、鸿蒙Next及各家小程序。
+* 【高性能】在app-vue、h5、微信小程序、QQ小程序上使用wxs+renderjs在视图层实现下拉刷新；支持虚拟列表，轻松渲染百万级列表数据！
+
+*** 
+### 反馈qq群
+* 官方1群`已满`：[790460711](https://jq.qq.com/?_wv=1027&k=vU2fKZZH)
+
+* 官方2群`已满`：[371624008](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=avPmibADf2TNi4LxkIwjCE5vbfXpa-r1&authKey=dQ%2FVDAR87ONxI4b32Py%2BvmXbhnopjHN7%2FJPtdsqJdsCPFZB6zDQ17L06Uh0kITUZ&noverify=0&group_code=371624008)
+* 官方3群：[343409055](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=sIaNqiCMIjxGQVksjytCw6R8DSiibHR7&authKey=pp995q8ZzFtl5F2xUwvvceP24QTcguWW%2FRVoDnMa8JZF4L2DmS%2B%2FV%2F5sYrcgPsmW&noverify=0&group_code=343409055)
+ 
+*** 
+
+### 预览
+
+***
+
+|                    自定义下拉刷新效果演示                    |                   滑动切换选项卡+吸顶演示                    | 聊天记录模式演示                                             |
+| :----------------------------------------------------------: | :----------------------------------------------------------: | ------------------------------------------------------------ |
+| ![](https://z-paging.zxlee.cn/public/img/z-paging-demo5.gif) | ![](https://z-paging.zxlee.cn/public/img/z-paging-demo6.gif) | ![](https://z-paging.zxlee.cn/public/img/z-paging-demo7.gif) |
+
+|                 虚拟列表(流畅渲染1万+条)演示                 |                       下拉进入二楼演示                       | 在弹窗内使用演示                                             |
+| :----------------------------------------------------------: | :----------------------------------------------------------: | ------------------------------------------------------------ |
+| ![](https://z-paging.zxlee.cn/public/img/z-paging-demo8.gif) | ![](https://z-paging.zxlee.cn/public/img/z-paging-demo9.gif) | ![](https://z-paging.zxlee.cn/public/img/z-paging-demo10.gif) |
+
+
+### 在线demo体验地址：
+
+* [https://demo.z-paging.zxlee.cn](https://demo.z-paging.zxlee.cn)
+
+| 扫码体验                                                     |
+| ------------------------------------------------------------ |
+| ![](https://z-paging.zxlee.cn/public/img/code.png) |
+
+### demo下载
+* 支持vue2&vue3的`选项式api`写法demo下载，请点击页面右上角的【使用HBuilderX导入示例项目】或【下载示例项目ZIP】。
+* 支持vue3的`组合式api`写法demo下载，请访问[github](https://github.com/SmileZXLee/uni-z-paging)。
\ No newline at end of file
diff --git a/uni_modules/z-paging/types/comps.d.ts b/uni_modules/z-paging/types/comps.d.ts
new file mode 100644
index 0000000..1b2cd45
--- /dev/null
+++ b/uni_modules/z-paging/types/comps.d.ts
@@ -0,0 +1,11 @@
+declare module 'vue' {
+  export interface GlobalComponents {
+    ['z-paging']: typeof import('./comps/z-paging')['ZPaging']
+    ['z-paging-swiper']: typeof import('./comps/z-paging-swiper')['ZPagingSwiper']
+    ['z-paging-swiper-item']: typeof import('./comps/z-paging-swiper-item')['ZPagingSwiperItem']
+    ['z-paging-empty-view']: typeof import('./comps/z-paging-empty-view')['ZPagingEmptyView']
+    ['z-paging-cell']: typeof import('./comps/z-paging-cell')['ZPagingCell']
+  }
+}
+
+export {}
diff --git a/uni_modules/z-paging/types/comps/_common.d.ts b/uni_modules/z-paging/types/comps/_common.d.ts
new file mode 100644
index 0000000..03cb105
--- /dev/null
+++ b/uni_modules/z-paging/types/comps/_common.d.ts
@@ -0,0 +1,9 @@
+export interface AllowedComponentProps {
+  class?: unknown;
+  style?: unknown;
+}
+
+export interface VNodeProps {
+  key?: string | number | symbol;
+  ref?: unknown;
+}
diff --git a/uni_modules/z-paging/types/comps/z-paging-cell.d.ts b/uni_modules/z-paging/types/comps/z-paging-cell.d.ts
new file mode 100644
index 0000000..d0113c8
--- /dev/null
+++ b/uni_modules/z-paging/types/comps/z-paging-cell.d.ts
@@ -0,0 +1,29 @@
+import { AllowedComponentProps, VNodeProps } from './_common'
+
+// ****************************** Props ******************************
+declare interface ZPagingCellProps {
+  /**
+   * z-paging-cell样式
+   */
+  cellStyle?: Partial<CSSStyleDeclaration>
+}
+
+// ****************************** Slots ******************************
+declare interface ZPagingCellSlots {
+  // ******************** 主体布局Slot ********************
+  /**
+   * 默认插入的view
+   */
+  ['default']?: () => any
+}
+
+declare interface _ZPagingCell {
+  new (): {
+    $props: AllowedComponentProps &
+      VNodeProps &
+      ZPagingCellProps
+    $slots: ZPagingCellSlots
+  }
+}
+
+export declare const ZPagingCell: _ZPagingCell
diff --git a/uni_modules/z-paging/types/comps/z-paging-empty-view.d.ts b/uni_modules/z-paging/types/comps/z-paging-empty-view.d.ts
new file mode 100644
index 0000000..47e489f
--- /dev/null
+++ b/uni_modules/z-paging/types/comps/z-paging-empty-view.d.ts
@@ -0,0 +1,95 @@
+import { AllowedComponentProps, VNodeProps } from './_common'
+
+// ****************************** Props ******************************
+declare interface ZPagingEmptyViewProps {
+  /**
+   * 空数据图片是否铺满z-paging，默认为是。若设置为否，则为填充满z-paging的剩余部分
+   * @default false
+   * @since 2.0.3
+   */
+  emptyViewFixed?: boolean;
+
+  /**
+   * 空数据图描述文字
+   * @default "没有数据哦~"
+   */
+  emptyViewText?: string;
+
+  /**
+   * 空数据图图片，默认使用z-paging内置的图片
+   * - 建议使用绝对路径，开头不要添加"@"，请以"/"开头
+   */
+  emptyViewImg?: string;
+
+  /**
+   * 空数据图点击重新加载文字
+   * @default "重新加载"
+   * @since 1.6.7
+   */
+  emptyViewReloadText?: string;
+
+  /**
+   * 空数据图样式，可设置空数据view的top等
+   * - 如果空数据图不是fixed布局，则此处是`margin-top`
+   */
+  emptyViewStyle?: Partial<CSSStyleDeclaration>;
+
+  /**
+   * 空数据图img样式
+   */
+  emptyViewImgStyle?: Partial<CSSStyleDeclaration>;
+
+  /**
+   * 空数据图描述文字样式
+   */
+  emptyViewTitleStyle?: Partial<CSSStyleDeclaration>;
+
+  /**
+   * 空数据图重新加载按钮样式
+   * @since 1.6.7
+   */
+  emptyViewReloadStyle?: Partial<CSSStyleDeclaration>;
+
+  /**
+   * 是否显示空数据图重新加载按钮(无数据时)
+   * @default false
+   * @since 1.6.7
+   */
+  showEmptyViewReload?: boolean;
+
+  /**
+   * 是否是加载失败
+   * @default false
+   */
+  isLoadFailed?: boolean;
+
+  /**
+   * 空数据图中布局的单位
+   * @default 'rpx'
+   * @since 2.6.7
+   */
+  unit?: 'rpx' | 'px';
+
+  // ****************************** Events ******************************
+  /**
+   * 点击了重新加载按钮
+   */
+  onReload?: () => void
+
+  /**
+   * 点击了空数据view
+   * @since 2.3.3
+   */
+  onViewClick?: () => void
+}
+
+declare interface _ZPagingEmptyView {
+  new (): {
+    $props: AllowedComponentProps &
+      VNodeProps &
+      ZPagingEmptyViewProps
+  }
+}
+
+export declare const ZPagingEmptyView: _ZPagingEmptyView
+
diff --git a/uni_modules/z-paging/types/comps/z-paging-swiper-item.d.ts b/uni_modules/z-paging/types/comps/z-paging-swiper-item.d.ts
new file mode 100644
index 0000000..e956a97
--- /dev/null
+++ b/uni_modules/z-paging/types/comps/z-paging-swiper-item.d.ts
@@ -0,0 +1,95 @@
+import { AllowedComponentProps, VNodeProps } from './_common'
+
+// ****************************** Props ******************************
+declare interface ZPagingSwiperItemProps {
+  /**
+   * 当前组件的index，也就是当前组件是swiper中的第几个
+   * @default 0
+   */
+  tabIndex?: number
+
+  /**
+   * 当前swiper切换到第几个index
+   * @default 0
+   */
+  currentIndex?: number
+
+  /**
+   * 是否使用虚拟列表。使用页面滚动或nvue时，不支持虚拟列表。在nvue中z-paging内置了list组件，效果与虚拟列表类似，并且可以提供更好的性能。
+   * @default false
+   */
+  useVirtualList?: boolean
+
+  /**
+   * 虚拟列表cell高度模式，默认为`fixed`，也就是每个cell高度完全相同，将以第一个cell高度为准进行计算。
+   * @default 'fixed'
+   */
+  cellHeightMode?: 'fixed' | 'dynamic'
+
+  /**
+   * 预加载的列表可视范围(列表高度)页数。此数值越大，则虚拟列表中加载的dom越多，内存消耗越大(会维持在一个稳定值)，但增加预加载页面数量可缓解快速滚动短暂白屏问题。
+   * @default 12
+   */
+  preloadPage?: number | string
+
+  /**
+   * 虚拟列表列数，默认为1。常用于每行有多列的情况，例如每行有2列数据，需要将此值设置为2。
+   * @default 1
+   * @since 2.2.8
+   */
+  virtualListCol?: number | string
+
+  /**
+   * 虚拟列表scroll取样帧率，默认为80，过低容易出现白屏问题，过高容易出现卡顿问题
+   * @default 80
+   */
+  virtualScrollFps?: number | string
+
+  /**
+   * 是否在z-paging内部循环渲染列表(使用内置列表)。
+   * @default false
+   */
+  useInnerList?: boolean
+
+  /**
+   * 内置列表cell的key名称(仅nvue有效，在nvue中开启use-inner-list时必须填此项)
+   * @since 2.2.7
+   */
+  cellKeyName?: string
+
+  /**
+   * innerList样式
+   */
+  innerListStyle?: Partial<CSSStyleDeclaration>
+}
+
+// ****************************** Methods ******************************
+declare interface _ZPagingSwiperItemRef {
+  /**
+   * 重新加载分页数据，pageNo恢复为默认值，相当于下拉刷新的效果
+   *
+   * @param [animate=false] 是否展示下拉刷新动画
+   */
+  reload: (animate?: boolean) => void;
+
+  /**
+   * 请求结束
+   * - 当通过complete传进去的数组长度小于pageSize时，则判定为没有更多了
+   *
+   * @param [data] 请求结果数组
+   * @param [success=true] 是否请求成功
+   */
+  complete: (data?: any[] | false, success?: boolean) => void;
+}
+
+declare interface _ZPagingSwiperItem {
+  new (): {
+    $props: AllowedComponentProps &
+      VNodeProps &
+      ZPagingSwiperItemProps
+  }
+}
+
+export declare const ZPagingSwiperItem: _ZPagingSwiperItem
+
+export declare const ZPagingSwiperItemRef: _ZPagingSwiperItemRef
diff --git a/uni_modules/z-paging/types/comps/z-paging-swiper.d.ts b/uni_modules/z-paging/types/comps/z-paging-swiper.d.ts
new file mode 100644
index 0000000..2ab7bb6
--- /dev/null
+++ b/uni_modules/z-paging/types/comps/z-paging-swiper.d.ts
@@ -0,0 +1,89 @@
+import { AllowedComponentProps, VNodeProps } from './_common'
+
+// ****************************** Props ******************************
+declare interface ZPagingSwiperProps {
+  /**
+   * 是否使用fixed布局，若使用fixed布局，则z-paging-swiper的父view无需固定高度，z-paging高度默认铺满屏幕，页面中的view请放z-paging-swiper标签内，需要固定在顶部的view使用slot="top"包住，需要固定在底部的view使用slot="bottom"包住。
+   * @default true
+   */
+  fixed?: boolean
+
+  /**
+   * 是否开启底部安全区域适配
+   * @default false
+   */
+  safeAreaInsetBottom?: boolean
+
+  /**
+   * z-paging-swiper样式
+   */
+  swiperStyle?: Partial<CSSStyleDeclaration>
+}
+
+
+// ****************************** Slots ******************************
+declare interface ZPagingSwiperSlots {
+  // ******************** 主体布局Slot ********************
+  /**
+   * 默认插入的view
+   */
+  ['default']?: () => any
+
+  /**
+   * 可以将自定义导航栏、tab-view等需要固定的(不需要跟着滚动的)元素放入slot="top"的view中。
+   * 注意，当有多个需要固定的view时，请用一个view包住它们，并且在这个view上设置slot="top"。需要固定在顶部的view请勿设置position: fixed;
+   * @since 1.5.5
+   */
+  ['top']?: () => any
+
+  /**
+   * 可以将需要固定在底部的(不需要跟着滚动的)元素放入slot="bottom"的view中。
+   * 注意，当有多个需要固定的view时，请用一个view包住它们，并且在这个view上设置slot="bottom"。需要固定在底部的view请勿设置position: fixed;
+   * @since 1.6.2
+   */
+  ['bottom']?: () => any
+
+  /**
+   * 可以将需要固定在左侧的(不需要跟着滚动的)元素放入slot="left"的view中。
+   * 注意，当有多个需要固定的view时，请用一个view包住它们，并且在这个view上设置slot="left"。需要固定在左侧的view请勿设置position: fixed;
+   * @since 2.2.3
+   */
+  ['left']?: () => any
+
+  /**
+   * 可以将需要固定在左侧的(不需要跟着滚动的)元素放入slot="right"的view中。
+   * 注意，当有多个需要固定的view时，请用一个view包住它们，并且在这个view上设置slot="right"。需要固定在右侧的view请勿设置position: fixed;
+   * @since 2.2.3
+   */
+  ['right']?: () => any
+}
+
+// ****************************** Methods ******************************
+declare interface _ZPagingSwiperRef {
+  /**
+   * 更新slot="left"和slot="right"宽度，当slot="left"或slot="right"宽度动态改变后调用
+   *
+   * @since 2.3.5
+   */
+  updateLeftAndRightWidth: () => void;
+
+  /**
+   * 更新fixed模式下z-paging-swiper的布局，在onShow时候调用，以修复在iOS+h5+tabbar+fixed+底部有安全区域的设备中从tabbar页面跳转到无tabbar页面后返回，底部有一段空白区域的问题
+   *
+   * @since 2.6.5
+   */
+  updateFixedLayout: () => void;
+}
+
+declare interface _ZPagingSwiper {
+  new (): {
+    $props: AllowedComponentProps &
+      VNodeProps &
+      ZPagingSwiperProps
+    $slots: ZPagingSwiperSlots
+  }
+}
+
+export declare const ZPagingSwiper: _ZPagingSwiper
+
+export declare const ZPagingSwiperRef: _ZPagingSwiperRef
diff --git a/uni_modules/z-paging/types/comps/z-paging.d.ts b/uni_modules/z-paging/types/comps/z-paging.d.ts
new file mode 100644
index 0000000..6f225c7
--- /dev/null
+++ b/uni_modules/z-paging/types/comps/z-paging.d.ts
@@ -0,0 +1,2131 @@
+import { AllowedComponentProps, VNodeProps } from './_common'
+
+type _Arrayable<T> = T | T[];
+
+/**
+ * i18n配置信息
+ */
+type _I18nText = Partial<Record<'en' | 'zh-Hans' | 'zh-Hant', string>>;
+
+declare global {
+  namespace ZPagingEnums {
+    /**
+     * query的触发来源：user-pull-down:用户主动下拉刷新 reload:通过reload触发 refresh:通过refresh触发 load-more:通过滚动到底部加载更多或点击底部加载更多触发
+     */
+    type QueryFrom = 'user-pull-down' | 'reload' | 'refresh' | 'load-more';
+
+    /**
+     * 下拉刷新状态：default:默认状态 release-to-refresh:松手立即刷新 loading:刷新中 complete:刷新结束 go-f2:松手进入二楼
+     */
+    type RefresherStatus = 'default' | 'release-to-refresh' | 'loading' | 'complete' | 'go-f2';
+
+    /**
+     * 下拉进入二楼状态：	go:二楼开启 close:二楼关闭
+     */
+    type GoF2Status = 'go' | 'close';
+
+    /**
+     * 底部加载更多状态：default:默认状态 loading:加载中 no-more:没有更多数据 fail:加载失败
+     */
+    type LoadMoreStatus = 'default' | 'loading' | 'no-more' | 'fail';
+
+    /**
+     * 列表触摸的方向，top代表用户将列表向上移动(scrollTop不断减小)，bottom代表用户将列表向下移动(scrollTop不断增大)
+     */
+    type TouchDirection = 'top' | 'bottom';
+
+    /**
+     * 列表滚动的方向，top代表用户将列表向上移动(scrollTop不断减小)，bottom代表用户将列表向下移动(scrollTop不断增大)
+     */
+    type ScrollDirection = 'top' | 'bottom';
+  }
+
+  namespace ZPagingParams {
+    /**
+     * z-paging返回数据
+     *
+     * @since 2.5.3
+     */
+    interface ReturnData<T> {
+      /**
+       * 总列表
+       */
+      totalList: T[];
+      /**
+       * 是否没有更多数据
+       */
+      noMore: boolean;
+    }
+
+    /**
+     * 嵌套父容器信息 [list组件](https://uniapp.dcloud.net.cn/component/list.html)
+     *
+     * @since 2.0.4
+     */
+    interface SetSpecialEffectsArgs {
+      /**
+       * 和list同时滚动的组件id，应为外层的scroller
+       */
+      id?: string;
+      /**
+       * 要吸顶的header顶部距离scroller顶部的距离
+       * - Android暂不支持
+       *
+       * @default 0
+       */
+      headerHeight?: number;
+    }
+
+    /**
+     * touchmove信息
+     */
+    interface RefresherTouchmoveInfo {
+      /** 下拉的距离 */
+      pullingDistance: number;
+      /** 前后两次回调滑动距离的差值 */
+      dy: number;
+      /** refresh组件高度 */
+      viewHeight: number;
+      /** pullingDistance/viewHeight的比值 */
+      rate: number;
+    }
+
+    /**
+     * 默认事件处理
+     */
+    type DefaultEventHandler = (value: boolean) => void;
+
+    /**
+     * 使用虚拟列表或内置列表时点击了cell的信息
+     */
+    interface InnerCellClickInfo {
+      /** 当前点击的item */
+      item: any;
+      /** 当前点击的index */
+      index: number;
+    }
+
+    /**
+     * 键盘的高度信息
+     */
+    interface KeyboardHeightInfo {
+      /** 键盘的高度 */
+      height: number;
+    }
+
+    /**
+     * 列表滚动信息(vue)
+     */
+    interface ScrollInfo {
+      detail: {
+          scrollLeft: number;
+          scrollTop: number;
+          scrollHeight: number;
+          scrollWidth: number;
+          deltaX: number;
+          deltaY: number;
+      }
+    }
+    /**
+     * 列表滚动信息(nvue)
+     */
+    interface ScrollInfoN {
+        contentSize: {
+            width: number;
+            height: number;
+        };
+        contentOffset: {
+            x: number;
+            y: number;
+        };
+        isDragging: boolean;
+    }
+
+    /**
+     * 滚动结束时触发事件信息
+     */
+    interface ScrollendEvent {
+      contentSize: {
+          width: number;
+          height: number;
+      };
+      contentOffset: {
+          x: number;
+          y: number;
+      };
+      isDragging: boolean;
+    }
+
+    /**
+     * 下拉刷新Slot的props
+     */
+    interface RefresherSlotProps {
+      /** 下拉刷新状态：default:默认状态 release-to-refresh:松手立即刷新 loading:刷新中 complete:刷新结束 go-f2:松手进入二楼 */
+      refresherStatus: ZPagingEnums.RefresherStatus; 
+    }
+
+    /**
+     * 空数据图Slot的props
+     */
+    interface EmptySlotProps {
+      /** 是否加载失败: 加载失败，false: 加载成功) */
+      isLoadFailed: boolean; 
+    }
+
+    /**
+     * 虚拟列表&内置列表中cell Slot的props
+     */
+    interface InnerListCellSlotProps {
+      /** 当前item */
+      item: any; 
+      /** 当前index */
+      index: number; 
+    }
+
+    /**
+     * 聊天记录加载中Slot的props
+     */
+    interface ChatLoadingSlotProps {
+      /** 底部加载更多状态：default:默认状态 loading:加载中 no-more:没有更多数据 fail:加载失败 */
+      loadingMoreStatus: ZPagingEnums.LoadMoreStatus; 
+    }
+  }
+
+  /**
+     * 虚拟列表数据项
+     *
+     * @since 2.7.7
+     */
+  type ZPagingVirtualItem<T> = T & {
+    /**
+     * 元素真实索引
+     */
+    zp_index: number;
+  };
+}
+
+// ****************************** Props ******************************
+declare interface ZPagingProps {
+  // ******************** 数据&布局配置 ********************
+  /**
+   * 父组件v-model所绑定的list的值
+   * @default []
+   */
+  value?: any[]
+
+  /**
+   * 自定义初始的pageNo(从第几页开始)
+   * @default 1
+   */
+  defaultPageNo?: number
+
+  /**
+   * 自定义pageSize(每页显示多少条)
+   * - 必须和后端的pageSize一致，例如后端分页的pageSize为15，此属性必须改为15
+   * @default 10
+   */
+  defaultPageSize?: number
+
+  /**
+   * z-paging是否使用fixed布局
+   * - 若使用fixed布局，则z-paging的父view无需固定高度，z-paging高度默认铺满屏幕，页面中的view请放在z-paging标签内，需要固定在顶部的view使用slot="top"包住，需要固定在底部的view使用slot="bottom"包住
+   * @default true
+   * @since 1.5.6
+   */
+  fixed?: boolean
+
+  /**
+   * 是否开启底部安全区域适配
+   * @default false
+   * @since 1.6.1
+   */
+  safeAreaInsetBottom?: boolean
+
+  /**
+   * 开启底部安全区域适配后，是否使用placeholder形式实现。
+   * - 为否时滚动区域会自动避开底部安全区域，也就是所有滚动内容都不会挡住底部安全区域，若设置为是，则滚动时滚动内容会挡住底部安全区域，但是当滚动到底部时才会避开底部安全区域
+   * @default false
+   * @since 2.2.7
+   */
+  useSafeAreaPlaceholder?: boolean
+
+  /**
+   * 使用页面滚动，默认为否。当设置为是时，则使用页面的滚动而非此组件内部的scroll-view的滚动。
+   * @default false
+   */
+  usePageScroll?: boolean
+
+  /**
+   * 使用页面滚动时，是否在不满屏时自动填充满屏幕
+   * @default true
+   * @since 2.0.6
+   */
+  autoFullHeight?: boolean
+
+  /**
+   * loading(下拉刷新、上拉加载更多)的主题样式，支持black，white
+   * @default 'black'
+   */
+  defaultThemeStyle?: 'black' | 'white'
+
+  /**
+   * 设置z-paging的style，部分平台(如微信小程序)无法直接修改组件的style，可使用此属性代替。
+   */
+  pagingStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 设置z-paging的class，优先级低于pagingStyle和height、width、maxWidth、bgColor
+   * @since 2.8.7
+   */
+  pagingClass?: string | string[] | Record<string, boolean>
+
+  /**
+   * z-paging的高度，优先级低于paging-style中设置的height
+   * - 传字符串，如100px、100rpx、100%
+   */
+  height?: string
+
+  /**
+   * z-paging的宽度，优先级低于paging-style中设置的width
+   * - 传字符串，如100px、100rpx、100%
+   */
+  width?: string
+
+  /**
+   * z-paging的最大宽度，优先级低于paging-style中设置的max-width
+   * - 默认为空，也就是铺满窗口宽度，若设置了特定值则会自动添加margin: 0 auto
+   */
+  maxWidth?: string
+
+  /**
+   * z-paging的背景色(为css中的background，因此也可以设置渐变，背景图片等)，优先级低于paging-style中设置的background-color。
+   * - 传字符串，如"#ffffff"
+   */
+  bgColor?: string
+
+  /**
+   * 是否监听列表触摸方向改变
+   * @default false
+   * @since 2.3.0
+   */
+  watchTouchDirectionChange?: boolean
+
+  /**
+   * 是否监听列表滚动方向改变
+   * @default false
+   * @since 2.8.7
+   */
+  watchScrollDirectionChange?: boolean
+  
+  /**
+   * 是否只使用基础布局
+   * - 设置为true后将关闭mounted自动请求数据、关闭下拉刷新和滚动到底部加载更多，强制隐藏空数据图
+   * @default false
+   * @since 2.8.7
+   */
+  layoutOnly?: boolean
+
+  /**
+   * 调用complete后延迟处理的时间，单位为毫秒，优先级高于min-delay
+   * @default 0
+   * @since 1.9.6
+   */
+  delay?: number | string
+
+  /**
+   * 触发@query后最小延迟处理的时间，单位为毫秒，优先级低于delay
+   * @default 0
+   * @since 2.0.9
+   */
+  minDelay?: number | string
+
+  /**
+   * 请求失败是否触发reject
+   * @default true
+   * @since 2.6.1
+   */
+  callNetworkReject?: boolean
+
+  /**
+   * z-paging中默认布局的单位
+   * @default rpx
+   * @since 2.6.7
+   */
+  unit?: 'rpx' | 'px'
+
+  /**
+   * 自动拼接complete中传过来的数组
+   * - 若设置为false，则complete中传过来的数组会直接覆盖list
+   * @default true
+   * @since 1.8.8
+   */
+  concat?: boolean
+
+  /**
+   * 为保证数据一致，设置当前tab切换时的标识key，并在complete中传递相同key，若二者不一致，则complete将不会生效
+   * @since 1.6.4
+   */
+  dataKey?: number | string | Record<string, any>
+
+  /**
+   * 【极简写法】自动注入的list名，可自动修改父view(包含ref="paging")中对应name的list值
+   * - z-paging标签必须设置ref="paging"
+   * @since 1.8.5
+   */
+  autowireListName?: string
+
+  /**
+   * 【极简写法】自动注入的query名，可自动调用父view(包含ref="paging")中的query方法
+   * - z-paging标签必须设置ref="paging"
+   * @since 1.8.5
+   */
+  autowireQueryName?: string
+
+  /**
+   * 获取分页数据Function，功能与@query类似。若设置了fetch则@query将不再触发。
+   * @since 2.7.8
+   */
+  fetch?: (...args: any[]) => any;
+
+  /**
+   * fetch的附加参数，fetch配置后有效
+   * @since 2.7.8
+   */
+  fetchParams?: Record<string, any>
+
+  // ******************** reload相关配置 ********************
+  /**
+   * z-paging mounted 后自动调用 reload 方法 (mounted 后自动调用接口)
+   * @default true
+   * @since 2.4.3
+   */
+  auto?: boolean
+
+  /**
+   * reload 时自动滚动到顶部
+   * - 如果reload时list被清空导致占位消失，也可能会自动返回到顶部，因此如果是这种情况还需要将autoCleanListWhenReload设置为false
+   * @default true
+   */
+  autoScrollToTopWhenReload?: boolean
+
+  /**
+   * reload时立即自动清空原list若立即自动清空，则在reload之后、请求回调之前页面是空白的
+   * @default true
+   */
+  autoCleanListWhenReload?: boolean
+
+  /**
+   * 列表刷新时自动显示下拉刷新 view
+   * @default false
+   * @since 1.7.2
+   */
+  showRefresherWhenReload?: boolean
+
+  /**
+   * 列表刷新时自动显示加载更多view，且为加载中状态 (仅初始设置有效，不可动态修改)
+   * @default false
+   * @since 1.7.2
+   */
+  showLoadingMoreWhenReload?: boolean
+
+  /**
+   * 组件 created 时立即触发 reload (可解决一些情况下先看到页面再看到 loading 的问题)
+   * - auto 为 true 时有效。为否时将在 mounted+nextTick 后触发 reload
+   * @default false
+   * @since 2.2.3
+   */
+  createdReload?: boolean
+
+  // ******************** 下拉刷新配置 ********************
+  /**
+   * 是否开启下拉刷新
+   * @default true
+   */
+  refresherEnabled?: boolean
+
+  /**
+   * 设置自定义下拉刷新阈值，默认单位为px。支持传100、"100px"或"100rpx"
+   * - nvue无效
+   * @default '80rpx'
+   */
+  refresherThreshold?: number | string
+
+  /**
+   * 是否开启下拉刷新状态栏占位，适用于隐藏导航栏时，下拉刷新需要避开状态栏高度的情况
+   * @default false
+   * @since 2.6.1
+   */
+  useRefresherStatusBarPlaceholder?: boolean
+
+  /**
+   * 是否只使用下拉刷新
+   * - 设置为true后将关闭mounted自动请求数据、关闭滚动到底部加载更多，强制隐藏空数据图
+   * @default false
+   */
+  refresherOnly?: boolean
+
+  /**
+   * 是否使用自定义的下拉刷新，默认为是，即使用z-paging的下拉刷新
+   * - 设置为false即代表使用uni scroll-view自带的下拉刷新，h5、App、微信小程序以外的平台不支持uni scroll-view自带的下拉刷新
+   * @default true
+   */
+  useCustomRefresher?: boolean
+
+  /**
+   * 用户下拉刷新时是否触发reload方法
+   * @default true
+   */
+  reloadWhenRefresh?: boolean
+
+  /**
+   * 下拉刷新的主题样式，支持black，white
+   * @default 'black'
+   */
+  refresherThemeStyle?: string
+
+  /**
+   * 自定义下拉刷新中左侧图标的样式
+   */
+  refresherImgStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 自定义下拉刷新中右侧状态描述文字的样式
+   */
+  refresherTitleStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 自定义下拉刷新中右侧最后更新时间文字的样式
+   * - show-refresher-update-time为true时有效
+   */
+  refresherUpdateTimeStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 是否实时监听下拉刷新中进度，并通过@refresherTouchmove传递给父组件
+   * @default false
+   * @since 2.1.0
+   */
+  watchRefresherTouchmove?: boolean
+
+  /**
+   * 是否显示最后更新时间
+   * @default false
+   * @since 1.6.7
+   */
+  showRefresherUpdateTime?: boolean
+
+  /**
+   * 自定义下拉刷新默认状态下的文字
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '继续下拉刷新'
+   */
+  refresherDefaultText?: string | _I18nText
+
+  /**
+   * 自定义下拉刷新松手立即刷新状态下的文字
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '松开立即刷新'
+   */
+  refresherPullingText?: string | _I18nText
+
+  /**
+   * 自定义下拉刷新刷新中状态下的文字
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '正在刷新...'
+   */
+  refresherRefreshingText?: string | _I18nText
+
+  /**
+   * 自定义下拉刷新刷新结束状态下的文字
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '刷新成功'
+   * @since 2.0.6
+   */
+  refresherCompleteText?: string | _I18nText
+
+  /**
+   * 自定义下拉刷新默认状态下的图片
+   */
+  refresherDefaultImg?: string
+
+  /**
+   * 自定义下拉刷新松手立即刷新状态下的图片
+   */
+  refresherPullingImg?: string
+
+  /**
+   * 自定义下拉刷新刷新中状态下的图片
+   */
+  refresherRefreshingImg?: string
+
+  /**
+   * 自定义下拉刷新刷新结束状态下的图片
+   */
+  refresherCompleteImg?: string
+
+  /**
+   * 自定义下拉刷新刷新中状态下是否展示旋转动画
+   * @default true
+   * @since 2.5.8
+   */
+  refresherRefreshingAnimated?: boolean
+
+  /**
+   * 是否开启自定义下拉刷新刷新结束回弹动画效果
+   * @default true
+   */
+  refresherEndBounceEnabled?: boolean
+
+  /**
+   * 设置系统下拉刷新默认样式，支持设置 black，white，none
+   * @default 'black'
+   */
+  refresherDefaultStyle?: string
+
+  /**
+   * 设置自定义下拉刷新区域背景颜色
+   * @default '#FFFFFF00'
+   */
+  refresherBackground?: string
+
+  /**
+   * 设置固定的自定义下拉刷新区域背景颜色
+   * @default '#FFFFFF00'
+   */
+  refresherFixedBackground?: string
+
+  /**
+   * 设置固定的自定义下拉刷新区域高度
+   * @default 0
+   */
+  refresherFixedBacHeight?: number | string
+
+  /**
+   * 设置自定义下拉刷新默认状态下回弹动画时间，单位为毫秒
+   * @default 100
+   * @since 2.3.1
+   */
+  refresherDefaultDuration?: number | string
+
+  /**
+   * 自定义下拉刷新结束以后延迟收回的时间，单位为毫秒
+   * @default 0
+   * @since 2.0.6
+   */
+  refresherCompleteDelay?: number | string
+
+  /**
+   * 自定义下拉刷新结束收回动画时间，单位为毫秒
+   * @default 300
+   * @since 2.0.6
+   */
+  refresherCompleteDuration?: number | string
+
+  /**
+   * 下拉刷新时下拉到“松手立即刷新”状态时是否使手机短振动
+   * @default false
+   * @since 2.4.7
+   */
+  refresherVibrate?: boolean
+
+  /**
+   * 自定义下拉刷新刷新中状态是否允许列表滚动
+   * @default true
+   */
+  refresherRefreshingScrollable?: boolean
+
+  /**
+   * 自定义下拉刷新结束状态下是否允许列表滚动
+   * @default false
+   * @since 2.1.1
+   */
+  refresherCompleteScrollable?: boolean
+
+  /**
+   * 设置自定义下拉刷新下拉超出阈值后继续下拉位移衰减的比例
+   * @default 0.65
+   */
+  refresherOutRate?: number
+
+  /**
+   * 是否开启下拉进入二楼功能
+   * @default false
+   * @since 2.7.7
+   */
+  refresherF2Enabled?: boolean
+
+  /**
+   * 下拉进入二楼阈值
+   * @default '200rpx'
+   * @since 2.7.7
+   */
+  refresherF2Threshold?: number | string
+
+  /**
+   * 下拉进入二楼动画时间，单位为毫秒
+   * @default 200
+   * @since 2.7.7
+   */
+  refresherF2Duration?: number | string
+
+  /**
+   * 下拉进入二楼状态松手后是否弹出二楼
+   * @default true
+   * @since 2.7.7
+   */
+  showRefresherF2?: boolean
+
+  /**
+   * 设置自定义下拉刷新下拉时实际下拉位移与用户下拉距离的比值
+   * @default 0.75
+   * @since 2.3.7
+   */
+  refresherPullRate?: number
+
+  /**
+   * 自定义下拉刷新下拉帧率，默认为40，过高可能会出现抖动问题
+   * @default 40
+   */
+  refresherFps?: number | string
+
+  /**
+   * 自定义下拉刷新允许触发的最大下拉角度，默认为40度
+   * - 值小于0或大于90时，代表不受角度限
+   * @default 40
+   * @since 2.5.8
+   */
+  refresherMaxAngle?: number | string
+
+  /**
+   * 自定义下拉刷新的角度由未达到最大角度变到达到最大角度时，是否继续下拉刷新手势
+   * @default false
+   */
+  refresherAngleEnableChangeContinued?: boolean
+
+  /**
+   * 下拉刷新时是否禁止下拉刷新view跟随用户触摸竖直移动
+   * @default false
+   * @since 2.5.8
+   */
+  refresherNoTransform?: boolean
+
+  // ******************** 底部加载更多配置 ********************
+  /**
+   * 是否启用加载更多数据(含滑动到底部加载更多数据和点击加载更多数据)
+   * @default true
+   */
+  loadingMoreEnabled?: boolean
+
+  /**
+   * 距底部/右边多远时，触发 scrolltolower 事件，默认单位为px
+   * - 支持传100、"100px"或"100rpx"
+   * @default '100rpx'
+   */
+  lowerThreshold?: number | string
+
+  /**
+   * 是否启用滑动到底部加载更多数据
+   * @default true
+   */
+  toBottomLoadingMoreEnabled?: boolean
+
+  /**
+   * 底部加载更多的主题样式，支持black，white
+   * @default 'black'
+   */
+  loadingMoreThemeStyle?: string
+
+  /**
+   * 自定义底部加载更多样式；如：{'background':'red'} 
+   * - 此属性无法修改文字样式，修改文字样式请使用loading-more-title-custom-style
+   */
+  loadingMoreCustomStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 自定义底部加载更多文字样式；如：{'color':'red'}
+   * @since 2.1.7
+   */
+  loadingMoreTitleCustomStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 自定义底部加载更多加载中动画样式
+   */
+  loadingMoreLoadingIconCustomStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 自定义底部加载更多加载中动画图标类型
+   * - 可选flower或circle，默认为flower (nvue不支持)
+   * @default 'flower'
+   */
+  loadingMoreLoadingIconType?: 'flower' | 'circle'
+
+  /**
+   * 自定义底部加载更多加载中动画图标图片
+   * - 若设置则使用自定义的动画图标，loading-more-loading-icon-type将无效 (nvue无效)
+   */
+  loadingMoreLoadingIconCustomImage?: string
+
+  /**
+   * 底部加载更多加载中view是否展示旋转动画
+   * - loading-more-loading-icon-custom-image有值时有效，nvue无效
+   * @default true
+   * @since 1.9.4
+   */
+  loadingMoreLoadingAnimated?: boolean
+
+  /**
+   * 滑动到底部"默认"文字
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '点击加载更多'
+   */
+  loadingMoreDefaultText?: string | _I18nText
+
+  /**
+   * 滑动到底部"加载中"文字 
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '正在加载...'
+   */
+  loadingMoreLoadingText?: string | _I18nText
+
+  /**
+   * 滑动到底部"没有更多"文字 
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '没有更多了'
+   */
+  loadingMoreNoMoreText?: string | _I18nText
+
+  /**
+   * 滑动到底部"加载失败"文字 
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '加载失败，点击重新加载'
+   */
+  loadingMoreFailText?: string | _I18nText
+
+  /**
+   * 当没有更多数据且分页内容未超出z-paging时是否隐藏没有更多数据的view 
+   * - nvue不支持，nvue中请使用hide-no-more-by-limit控制
+   * @default false
+   * @since 2.4.3
+   */
+  hideNoMoreInside?: boolean
+
+  /**
+   * 当没有更多数据且分页数组长度少于这个值时，隐藏没有更多数据的view
+   * - 默认为0，代表不限制。此属性优先级高于`hide-no-more-inside`
+   * @default 0
+   * @since 2.4.3
+   */
+  hideNoMoreByLimit?: number
+
+  /**
+   * 当分页未满一屏时，是否自动加载更多 (nvue无效)
+   * @default false
+   * @since 2.0.0
+   */
+  insideMore?: boolean
+
+  /**
+   * 滑动到底部状态为默认状态时，以加载中的状态展示
+   * - 若设置为是，可避免滚动到底部看到默认状态然后立刻变为加载中状态的问题，但分页数量未超过一屏时，不会显示【点击加载更多】
+   * @default false
+   * @since 2.2.0
+   */
+  loadingMoreDefaultAsLoading?: boolean
+
+  /**
+   * 是否显示没有更多数据的view
+   * @default true
+   */
+  showLoadingMoreNoMoreView?: boolean
+
+  /**
+   * 是否显示默认的加载更多text
+   * @default true
+   */
+  showDefaultLoadingMoreText?: boolean
+
+  /**
+   * 是否显示没有更多数据的分割线，默认为是
+   * @default true
+   */
+  showLoadingMoreNoMoreLine?: boolean
+
+  /**
+   * 自定义底部没有更多数据的分割线样式
+   */
+  loadingMoreNoMoreLineCustomStyle?: Partial<CSSStyleDeclaration>
+
+  // ******************** 空数据与加载失败配置 ********************
+  /**
+   * 是否强制隐藏空数据图
+   * @default false
+   */
+  hideEmptyView?: boolean
+
+  /**
+   * 空数据图片是否铺满z-paging
+   * - 默认为否，即填充满z-paging内列表(滚动区域)部分。若设置为否，则为填铺满整个z-paging
+   * @default false
+   * @since 2.0.3
+   */
+  emptyViewFixed?: boolean
+
+  /**
+   * 空数据图片是否垂直居中
+   * - 默认为是，若设置为否即为从空数据容器顶部开始显示 (empty-view-fixed为false时有效)
+   * @default true
+   * @since 2.0.6
+   */
+  emptyViewCenter?: boolean
+
+  /**
+   * 空数据图描述文字 
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '没有数据哦~'
+   */
+  emptyViewText?: string | _I18nText
+
+  /**
+   * 空数据图图片，默认使用z-paging内置的图片
+   * - 建议使用绝对路径，开头不要添加"@"，请以"/"开头
+   */
+  emptyViewImg?: string
+
+  /**
+   * 空数据图“加载失败”图片，默认使用z-paging内置的图片
+   * - 建议使用绝对路径，开头不要添加"@"，请以"/"开头
+   * @since 1.6.7
+   */
+  emptyViewErrorImg?: string
+
+  /**
+   * 空数据图点击重新加载文字 
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '重新加载'
+   * @since 1.6.7
+   */
+  emptyViewReloadText?: string | _I18nText
+
+  /**
+   * 空数据图“加载失败”描述文字 
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '很抱歉，加载失败'
+   * @since 1.6.7
+   */
+  emptyViewErrorText?: string | _I18nText
+  /**
+   * 空数据图父view样式
+   */
+  emptyViewSuperStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 空数据图样式，可设置空数据view的top等，如：:empty-view-style="{'top':'100rpx'}"
+   */
+  emptyViewStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 空数据图img样式
+   */
+  emptyViewImgStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 空数据图描述文字样式
+   */
+  emptyViewTitleStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 空数据图重新加载按钮样式
+   * @since 1.6.7
+   */
+  emptyViewReloadStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * 是否显示空数据图重新加载按钮(无数据时)
+   * @default false
+   * @since 1.6.7
+   */
+  showEmptyViewReload?: boolean
+
+  /**
+   * 加载失败时是否显示空数据图重新加载按钮
+   * @default true
+   * @since 1.6.7
+   */
+  showEmptyViewReloadWhenError?: boolean
+
+  /**
+   * 加载中时是否自动隐藏空数据图
+   * @default true
+   */
+  autoHideEmptyViewWhenLoading?: boolean
+
+  /**
+   * 用户下拉列表触发下拉刷新加载中时是否自动隐藏空数据图
+   * @default true
+   * @since 2.0.9
+   */
+  autoHideEmptyViewWhenPull?: boolean
+
+  // ******************** 全屏Loading配置 ********************
+  /**
+   * 第一次加载后自动隐藏loading slot
+   * @default true
+   */
+  autoHideLoadingAfterFirstLoaded?: boolean
+
+  /**
+   * loading slot的父view是否铺满屏幕并固定
+   * - 设置为true后，插入的loading的父view会铺满全屏。注意：插入的loading需要设置height:100%（nvue为flex:1）才可铺满全屏。loading内的view从导航栏顶部开始，会被导航栏盖住，请妥善处理。
+   * @default false
+   * @since 2.0.9
+   */
+  loadingFullFixed?: boolean
+
+  /**
+   * 是否自动显示系统Loading：即uni.showLoading
+   * - 若开启则将在刷新列表时（调用reload、refresh时）显示。下拉刷新和滚动到底部加载更多不会显示。
+   * @default false
+   * @since 2.3.7
+   */
+  autoShowSystemLoading?: boolean
+
+  /**
+   * 显示系统Loading时显示的文字
+   * - 支持直接传字符串或形如：{'en':'英文','zh-Hans':'简体中文','zh-Hant':'繁体中文'}的i18n配置
+   * @default '加载中...'
+   * @since 2.3.7
+   */
+  systemLoadingText?: string | _I18nText
+
+  /**
+   * 显示系统Loading时是否显示透明蒙层，防止触摸穿透。H5、App、微信小程序、百度小程序有效。
+   * @default true
+   * @since 2.3.9
+   */
+  systemLoadingMask?: boolean
+
+  // ******************** 返回顶部按钮配 ********************
+  /**
+   * 自动显示点击返回顶部按钮
+   * @default false
+   */
+  autoShowBackToTop?: boolean
+
+  /**
+   * 点击返回顶部按钮显示/隐藏的阈值(滚动距离)，默认单位为px
+   * - 支持传100、"100px"或"100rpx"
+   * @default 400rpx
+   */
+  backToTopThreshold?: number | string
+
+  /**
+   * 点击返回顶部按钮的自定义图片地址
+   * - 建议使用绝对路径，开头不要添加"@"，请以"/"开头
+   * @default 'z-paging内置的图片'
+   */
+  backToTopImg?: string
+
+  /**
+   * 点击返回顶部按钮返回到顶部时是否展示过渡动画
+   * @default true
+   */
+  backToTopWithAnimate?: boolean
+
+  /**
+   * 点击返回顶部按钮与底部的距离，默认单位为px
+   * - 支持传100、"100px"或"100rpx"
+   * @default 160rpx
+   */
+  backToTopBottom?: number | string
+
+  /**
+   * 点击返回顶部按钮的自定义样式
+   */
+  backToTopStyle?: Partial<CSSStyleDeclaration>
+
+  // ******************** 虚拟列表&内置列表配置 ********************
+  /**
+   * 是否使用虚拟列表
+   * - 使用页面滚动或nvue时，不支持虚拟列表。在nvue中z-paging内置了list组件，效果与虚拟列表类似，并且可以提供更好的性能
+   * @default false
+   */
+  useVirtualList?: boolean
+
+  /**
+   * 在使用虚拟列表时，是否使用兼容模式。兼容模式写法较繁琐，但可提供良好的兼容性。
+   * @default false
+   * @since 2.4.0
+   */
+  useCompatibilityMode?: boolean
+
+  /**
+   * 使用兼容模式时传递的附加数据，可选、非必须
+   * @since 2.4.0
+   */
+  extraData?: Record<string, any>
+
+  /**
+   * 虚拟列表cell高度模式，默认为fixed，也就是每个cell高度完全相同，将以第一个cell高度为准进行计算。
+   * @default 'fixed'
+   */
+  cellHeightMode?: 'fixed' | 'dynamic'
+
+  /**
+   * 预加载的列表可视范围(列表高度)页数。此数值越大，则虚拟列表中加载的dom越多，内存消耗越大(会维持在一个稳定值)，但增加预加载页面数量可缓解快速滚动短暂白屏问题。
+   * @default 12
+   */
+  preloadPage?: number | string
+
+  /**
+   * 固定的cell高度，`cell-height-mode=fixed`才有效，若设置了值，则不计算第一个cell高度而使用设置的cell高度。默认单位为px
+   * - 支持传100、"100px"或"100rpx"
+   * @since 2.7.8
+   */
+  fixedCellHeight?: number | string
+
+  /**
+   * 虚拟列表列数，默认为1。常用于每行有多列的情况，例如每行有2列数据，需要将此值设置为2。
+   * @default 1
+   * @since 2.2.8
+   */
+  virtualListCol?: number | string
+
+  /**
+   * 虚拟列表scroll取样帧率，默认为80，过低容易出现白屏问题，过高容易出现卡顿问题
+   * @default 80
+   */
+  virtualScrollFps?: number | string
+
+  /**
+   * 虚拟列表cell id的前缀，适用于一个页面有多个虚拟列表的情况，用以区分不同虚拟列表cell的id
+   * - 注意：请勿传数字或以数字开头的字符串。如设置为list1，则cell的id应为：list1-zp-id-${item.zp_index}
+   * @since 2.8.1
+   */
+  virtualCellIdPrefix?: string
+
+  /**
+   * 是否在z-paging内部循环渲染列表(使用内置列表)。
+   * @default false
+   */
+  useInnerList?: boolean
+
+  /**
+   * 强制关闭inner-list。适用于开启了虚拟列表后需要强制关闭inner-list的情况。
+   * @default false
+   * @since 2.2.7
+   */
+  forceCloseInnerList?: boolean
+
+  /**
+   * 虚拟列表是否使用swiper-item包裹，默认为否，此属性为了解决vue3+(微信小程序或QQ小程序)中，使用非内置列表写法时，若z-paging在swiper-item内存在无法获取slot插入的cell高度进而导致虚拟列表失败的问题
+   * - 仅vue3+(微信小程序或QQ小程序)+非内置列表写法虚拟列表有效，其他情况此属性设置任何值都无效，所以如果您在swiper-item内使用z-paging的非内置虚拟列表写法，将此属性设置为true即可
+   * @default false
+   * @since 2.8.6
+   */
+  virtualInSwiperSlot?: boolean
+
+  /**
+   * 内置列表cell的key名称(仅nvue有效，在nvue中开启use-inner-list时必须填此项)
+   * @since 2.2.7
+   */
+  cellKeyName?: string
+
+  /**
+   * innerList样式
+   */
+  innerListStyle?: Partial<CSSStyleDeclaration>
+
+  /**
+   * innerCell样式
+   * @since 2.2.8
+   */
+  innerCellStyle?: Partial<CSSStyleDeclaration>
+
+  // ******************** 本地分页配置 ********************
+  /**
+   * 本地分页时上拉加载更多延迟时间，单位为毫秒
+   * @default 200
+   */
+  localPagingLoadingTime?: number | string
+
+  // ******************** 聊天记录模式配置 ********************
+  /**
+   * 使用聊天记录模式，为保证良好的体验。
+   * @default false
+   */
+  useChatRecordMode?: boolean;
+
+  /**
+   * 使用聊天记录模式时是否自动隐藏键盘(在用户触摸列表时候自动隐藏键盘)
+   * @default true
+   * @since 2.3.4
+   */
+  autoHideKeyboardWhenChat?: boolean;
+
+  /**
+   * 使用聊天记录模式中键盘弹出时是否自动调整slot="bottom"高度
+   * @default true
+   * @since 2.7.4
+   */
+  autoAdjustPositionWhenChat?: boolean;
+
+  /**
+   * 使用聊天记录模式中键盘弹出时是否自动滚动到底部
+   * @default false
+   * @since 2.7.4
+   */
+  autoToBottomWhenChat?: boolean;
+
+  /**
+   * 使用聊天记录模式中键盘弹出时占位高度偏移距离。默认0rpx。单位px
+   * @default "0px"
+   * @since 2.7.6
+   */
+  chatAdjustPositionOffset?: string;
+
+  /**
+   * 使用聊天记录模式中`reload`时是否显示`chatLoading`
+   * @default false
+   * @since 2.7.4
+   */
+  showChatLoadingWhenReload?: boolean;
+
+  /**
+   * `bottom`的背景色，默认透明，传字符串，如"#ffffff"
+   * @since 2.7.4
+   */
+  bottomBgColor?: string;
+
+  /**
+   * 在聊天记录模式中滑动到顶部状态为默认状态时，是否以加载中的状态展示
+   * @default true
+   * @since 2.7.5
+   */
+  chatLoadingMoreDefaultAsLoading?: boolean;
+
+  // ******************** scroll-view相关配置 ********************
+  /**
+   * 控制是否出现滚动条
+   * @default true
+   */
+  showScrollbar?: boolean;
+
+  /**
+   * 是否可以滚动，使用内置scroll-view和nvue时有效
+   * @default true
+   */
+  scrollable?: boolean;
+
+  /**
+   * 是否允许横向滚动
+   * @default false
+   * @since 2.0.6
+   */
+  scrollX?: boolean;
+
+  /**
+   * iOS设备上滚动到顶部时是否允许回弹效果
+   * - 关闭回弹效果后可使滚动到顶部后立即下拉可立即触发下拉刷新，但是有吸顶view时滚动到顶部时可能出现抖动
+   * @default false
+   */
+  scrollToTopBounceEnabled?: boolean;
+
+  /**
+   * iOS设备上滚动到底部时是否允许回弹效果。可能会导致使用scroll-view滚动时无法顺利滚动到底部
+   * @default true
+   */
+  scrollToBottomBounceEnabled?: boolean;
+
+  /**
+   * 在设置滚动条位置时使用动画过渡
+   * @default false
+   */
+  scrollWithAnimation?: boolean;
+
+  /**
+   * 值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚动到该元素。若在一些平台中无效，可以通过调用z-paging的scrollToxxx系列的方法实现。
+   */
+  scrollIntoView?: string;
+
+  /**
+   * iOS点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部。仅支持app-nvue，微信小程序。
+   * @default true
+   */
+  enableBackToTop?: boolean;
+
+  // ******************** nvue独有配置 ********************
+  /**
+   * nvue中修改列表类型。
+   * @default "list"
+   */
+  nvueListIs?: 'list' | 'waterfall' | 'scroller';
+
+  /**
+   * waterfall 配置，仅在 nvue 中且 nvueListIs=waterfall 时有效。示例: {'column-gap': 20}。配置参数详情参见: https://uniapp.dcloud.io/component/waterfall
+   */
+  nvueWaterfallConfig?: Record<string, any>;
+
+  /**
+   * nvue 控制是否回弹效果，iOS 不支持动态修改。注意: 若禁用回弹效果，下拉刷新将失效。
+   * @default true
+   */
+  nvueBounce?: boolean;
+
+  /**
+   * nvue 中通过代码滚动到顶部/底部时，是否加快动画效果(无滚动动画时无效)。
+   * @default false
+   * @since 1.9.4
+   */
+  nvueFastScroll?: boolean;
+
+  /**
+   * nvue 中 list 的 id。
+   * @since 2.0.4
+   */
+  nvueListId?: string;
+
+  /**
+   * 是否隐藏 nvue 列表底部的 tagView，此 view 用于标识滚动到底部位置。
+   * - 若隐藏则滚动到底部功能将失效。
+   * - 在 nvue 中实现吸顶+swiper 功能时需将最外层 z-paging 的此属性设置为 true。
+   * @default false
+   * @since 2.0.4
+   */
+  hideNvueBottomTag?: boolean;
+
+  /**
+   * 设置 nvue 中是否按分页模式(类似竖向 swiper)显示 List。
+   * @default false
+   * @since 2.3.1
+   */
+  nvuePagingEnabled?: boolean;
+
+  /**
+   * nvue 中控制 onscroll 事件触发的频率。表示两次 onscroll 事件之间列表至少滚动了指定的像素值。单位: px。
+   * @since 2.3.5
+   */
+  offsetAccuracy?: number;
+
+  // ******************** 缓存配置 ********************
+  /**
+   * 是否使用缓存。若开启，将自动缓存第一页的数据。注意：默认仅会缓存组件首次加载时第一次请求到的数据，后续的下拉刷新操作不会更新缓存。
+   * - 必须设置 `cacheKey`，否则缓存无效。
+   * @default false
+   */
+  useCache?: boolean;
+
+  /**
+   * 使用缓存时缓存的 key，用于区分不同列表的缓存数据。
+   * - useCache为 true 时必须设置，否则缓存无效。
+   */
+  cacheKey?: string;
+
+  /**
+   * 缓存模式。
+   * - default: 仅缓存组件首次加载时第一次请求到的数据。
+   * - always: 总是缓存，每次列表刷新(如下拉刷新、调用 reload 等)都会更新缓存。
+   * @default "default"
+   */
+  cacheMode?: 'default' | 'always';
+
+  // ******************** z-index配置 ********************
+  /**
+   * slot="top" 的 view 的 z-index。
+   * - 仅使用页面滚动时有效。
+   * @default 99
+   */
+  topZIndex?: number;
+
+  /**
+   * z-paging 内容容器父 view 的 z-index。
+   * @default 1
+   */
+  superContentZIndex?: number;
+
+  /**
+   * z-paging 内容容器部分的 z-index。
+   * @default 1
+   */
+  contentZIndex?: number;
+
+  /**
+   * 空数据 view 的 z-index。
+   * @default 9
+   */
+  emptyViewZIndex?: number;
+
+  // ******************** 其他配置 ********************
+  /**
+   * z-paging 是否自动高度。
+   * - 自动高度时会自动铺满屏幕，不需要设置父 view 为 100% 等操作。
+   * - 注意：自动高度可能并不准确。
+   * @deprecated 建议使用 fixed 代替。
+   * @default false
+   */
+  autoHeight?: boolean;
+
+  /**
+   * z-paging 自动高度时的附加高度。
+   * - 添加单位 px 或 rpx，默认为 px。
+   * - 若需要减少高度，请传负数，如 "-10rpx" 或 "10.5px"。
+   * @deprecated 建议使用 fixed 代替。
+   * @default "0px"
+   */
+  autoHeightAddition?: number | string;
+
+
+  // ****************************** Events ******************************
+
+  // ******************** 数据处理相关事件 ********************
+  /**
+   * 父组件v-model所绑定的list的值改变时触发此事件
+   * @param value 列表数据
+   */
+  onInput?: (value: any[]) => any
+  
+  /**
+   * 下拉刷新或滚动到底部时会自动触发此方法。z-paging加载时也会触发(若要禁止，请设置:auto="false")。pageNo和pageSize会自动计算好，直接传给服务器即可。
+   * @param pageNo 当前第几页
+   * @param pageSize 每页多少条
+   * @param from query的触发来源：user-pull-down:用户主动下拉刷新 reload:通过reload触发 refresh:通过refresh触发 load-more:通过滚动到底部加载更多或点击底部加载更多触发
+   */
+  onQuery?: (pageNo: number, pageSize: number, from: ZPagingEnums.QueryFrom) => void
+
+  /**
+   * 分页渲染的数组改变时触发
+   * @param list 最终的分页数据数组
+   */
+  onListChange?: (list: any[]) => void
+
+  // ******************** 下拉刷新相关事件 ********************
+  /**
+   * 自定义下拉刷新状态改变
+   * - use-custom-refresher为false时无效
+   * @param status 下拉刷新状态：default:默认状态 release-to-refresh:松手立即刷新 loading:刷新中 complete:刷新结束 go-f2:松手进入二楼
+   */
+  onRefresherStatusChange?: (status: ZPagingEnums.RefresherStatus) => void
+
+  /**
+   * 自定义下拉刷新下拉开始
+   * - use-custom-refresher为false时无效
+   * @param y 当前触摸开始的屏幕点的y值(单位px)
+   */
+  onRefresherTouchstart?: (y: number) => void
+  
+  /**
+   * 自定义下拉刷新下拉拖动中
+   * - use-custom-refresher为false时无效
+   * - 在使用wxs的平台上，为减少wxs与js通信折损，只有在z-paging添加@refresherTouchmove时，wxs才会实时将下拉拖动事件传给js，在微信小程序和QQ小程序中，因$listeners无效，所以必须设置:watch-refresher-touchmove="true"方可使此事件被触发
+   * @param info touchmove信息
+   */
+  onRefresherTouchmove?: (info: ZPagingParams.RefresherTouchmoveInfo) => void
+
+  /**
+   * 自定义下拉刷新下拉结束
+   * - use-custom-refresher为false时无效
+   * @param y 当前触摸开始的屏幕点的y值(单位px)
+   */
+  onRefresherTouchend?: (y: number) => void
+
+  /**
+   * 下拉进入二楼状态改变
+   * - use-custom-refresher为false时无效
+   * @param y 当前触摸开始的屏幕点的y值(单位px)
+   * @since 2.7.7
+   */
+  onRefresherF2Change?: (status: ZPagingEnums.GoF2Status) => void
+
+  /**
+   * 自定义下拉刷新被触发
+   */
+  onRefresh?: () => void
+
+  /**
+   * 自定义下拉刷新被复位
+   */
+  onRestore?: () => void
+
+  // ******************** 底部加载更多相关事件 ********************
+  /**
+   * 自定义下拉刷新状态改变
+   * - use-custom-refresher为false时无效
+   * @param status 底部加载更多状态：default:默认状态 loading:加载中 no-more:没有更多数据 fail:加载失败
+   */
+  onLoadingStatusChange?: (status: ZPagingEnums.LoadMoreStatus) => void
+
+  // ******************** 空数据与加载失败相关事件 ********************
+  /**
+   * 点击了空数据图中的重新加载按钮
+   * @param handler 点击空数据图中重新加载后是否进行reload操作，默认为是。如果需要禁止reload事件，则调用handler(false)
+   * @since 1.8.0
+   */
+  onEmptyViewReload?: (handler: ZPagingParams.DefaultEventHandler) => void
+
+  /**
+   * 点击了空数据图view
+   * @since 2.3.3
+   */
+  onEmptyViewClick?: () => void
+
+  /**
+   * z-paging请求失败状态改变
+   * @param isLoadFailed 当前是否是请求失败状态，为true代表是，反之为否；默认状态为否
+   * @since 2.5.0
+   */
+  onIsLoadFailedChange?: (isLoadFailed: boolean) => void
+
+  // ******************** 返回顶部按钮相关事件 ********************
+  /**
+   * 点击了返回顶部按钮
+   * @param handler 点击返回顶部按钮后是否滚动到顶部，默认为是。如果需要禁止滚动到顶部事件，则调用handler(false)
+   * @since 2.6.1
+   */
+  onBackToTopClick?: (handler: ZPagingParams.DefaultEventHandler) => void
+
+  // ******************** 虚拟列表&内置列表相关事件 ********************
+  /**
+   * 虚拟列表当前渲染的数组改变时触发，在虚拟列表中只会渲染可见区域内+预加载页面的数据
+   * - nvue无效
+   * @param list 虚拟列表当前渲染的数组
+   * @since 2.2.7
+   */
+  onVirtualListChange?: (list: any[]) => void
+
+  /**
+   * 使用虚拟列表或内置列表时点击了cell
+   * - nvue无效
+   * @param list 虚拟列表当前渲染的数组
+   * @since 2.4.0
+   */
+  onInnerCellClick?: (info: ZPagingParams.InnerCellClickInfo) => void
+
+  /**
+   * 虚拟列表顶部占位高度改变
+   * - nvue无效
+   * @param height 虚拟列表顶部占位高度(单位：px)
+   * @since 2.7.12
+   */
+  onVirtualPlaceholderTopHeight?: (height: number) => void
+
+  // ******************** 聊天记录模式相关事件 ********************
+  /**
+   * 在聊天记录模式下，触摸列表隐藏了键盘
+   * - nvue无效
+   * @since 2.3.6
+   */
+  onHidedKeyboard?: () => void
+  
+  /**
+   * 键盘高度改变
+   * @param info 键盘高度信息
+   * @since 2.7.1
+   */
+  onKeyboardHeightChange?: (info: ZPagingParams.KeyboardHeightInfo) => void
+
+  /**
+   * z-paging列表滚动时触发
+   * @param event 滚动事件信息，vue使用_ScrollInfo，nvue使用_ScrollInfoN
+   */
+  onScroll?: (event: ZPagingParams.ScrollInfo | ZPagingParams.ScrollInfoN) => void
+
+  /**
+   * scrollTop改变时触发，使用点击返回顶部时需要获取scrollTop时可使用此事件
+   * @param scrollTop 
+   */
+  onScrollTopChange?: (scrollTop: number) => void
+
+  /**
+   * z-paging内置的scroll-view/list-view/waterfall滚动底部时触发
+   */
+  onScrolltolower?: () => void
+
+  /**
+   * z-paging内置的scroll-view/list-view/waterfall滚动顶部时触发
+   */
+  onScrolltoupper?: () => void
+
+  /**
+   * z-paging内置的list滚动结束时触发
+   * - 仅nvue有效
+   * @param event 滚动结束时触发事件信息
+   * @since 2.7.3
+   */
+  onScrollend?: (event: ZPagingParams.ScrollendEvent) => void
+
+  // ******************** 布局&交互相关事件 ********************
+  /**
+   * z-paging中内容高度改变时触发
+   * @param height 改变后的高度
+   * @since 2.1.3
+   */
+  onContentHeightChanged?: (height: number) => void
+
+  /**
+   * 监听列表触摸方向改变
+   * - nvue无效
+   * - 必须同时设置:watch-touch-direction-change="true"
+   * @param direction 列表触摸的方向，top代表用户将列表向上移动(scrollTop不断减小)，bottom代表用户将列表向下移动(scrollTop不断增大)
+   * @since 2.3.0
+   */
+  onTouchDirectionChange?: (direction: ZPagingEnums.TouchDirection) => void
+
+  /**
+   * 监听列表滚动方向改变
+   * - 页面滚动无效
+   * - 必须同时设置:watch-scroll-direction-change="true"
+   * @param direction 列表滚动的方向，top代表用户将列表向上移动(scrollTop不断减小)，bottom代表用户将列表向下移动(scrollTop不断增大)
+   * @since 2.8.7
+   */
+  onScrollDirectionChange?: (direction: ZPagingEnums.ScrollDirection) => void
+}
+
+
+// ****************************** Slots ******************************
+declare interface ZPagingSlots {
+  // ******************** 主体布局Slot ********************
+  /**
+   * 默认插入的列表view
+   */
+  ['default']?: () => any
+
+  /**
+   * 可以将自定义导航栏、tab-view等需要固定的(不需要跟着滚动的)元素放入slot="top"的view中。
+   * 注意，当有多个需要固定的view时，请用一个view包住它们，并且在这个view上设置slot="top"。需要固定在顶部的view请勿设置position: fixed;
+   * @since 1.5.5
+   */
+  ['top']?: () => any
+
+  /**
+   * 可以将需要固定在底部的(不需要跟着滚动的)元素放入slot="bottom"的view中。
+   * 注意，当有多个需要固定的view时，请用一个view包住它们，并且在这个view上设置slot="bottom"。需要固定在底部的view请勿设置position: fixed;
+   * @since 1.6.2
+   */
+  ['bottom']?: () => any
+
+  /**
+   * 可以将需要固定在左侧的(不需要跟着滚动的)元素放入slot="left"的view中。
+   * 注意，当有多个需要固定的view时，请用一个view包住它们，并且在这个view上设置slot="left"。需要固定在左侧的view请勿设置position: fixed;
+   * @since 2.2.3
+   */
+  ['left']?: () => any
+
+  /**
+   * 可以将需要固定在左侧的(不需要跟着滚动的)元素放入slot="right"的view中。
+   * 注意，当有多个需要固定的view时，请用一个view包住它们，并且在这个view上设置slot="right"。需要固定在右侧的view请勿设置position: fixed;
+   * @since 2.2.3
+   */
+  ['right']?: () => any
+
+  // ******************** 下拉刷新Slot ********************
+  /**
+   * 自定义下拉刷新view，设置后则不使用uni自带的下拉刷新view和z-paging自定义的下拉刷新view。此view的style必须设置为height:100%
+   * - 在非nvue中，自定义下拉刷新view的高度受refresher-threshold控制，因此如果它的高度不为默认的80rpx，则需要设置refresher-threshold="自定义下拉刷新view的高度"
+   * @param refresherStatus 下拉刷新状态：default:默认状态 release-to-refresh:松手立即刷新 loading:刷新中 complete:刷新结束 go-f2:松手进入二楼
+   */
+  ['refresher']?: (props: ZPagingParams.RefresherSlotProps) => any
+
+  /**
+   * 自定义结束状态下的下拉刷新view，若设置，当下拉刷新结束时，会替换当前状态下的下拉刷新view。
+   * - 注意：默认情况下您无法看到结束状态的下拉刷新view，除非您设置了refresher-complete-delay并且值足够大，例如：500
+   * @since 2.1.1
+   */
+  ['refresherComplete']?: () => any
+
+  /**
+   * 自定义松手显示二楼状态下的view
+   * @since 2.7.7
+   */
+  ['refresherF2']?: () => any
+
+  /**
+   * 自定义需要插入二楼的view
+   * @since 2.7.7
+   */
+  ['f2']?: () => any
+
+  // ******************** 底部加载更多Slot ********************
+  /**
+   * 自定义滑动到底部"默认"状态的view(即"点击加载更多view")
+   */
+  ['loadingMoreDefault']?: () => any
+
+  /**
+   * 自定义滑动到底部"加载中"状态的view
+   */
+  ['loadingMoreLoading']?: () => any
+
+  /**
+   * 自定义滑动到底部"没有更多数据"状态的view
+   */
+  ['loadingMoreNoMore']?: () => any
+
+  /**
+   * 自定义滑动到底部"加载失败"状态的view
+   */
+  ['loadingMoreFail']?: () => any
+
+  // ******************** 空数据图Slot ********************
+  /**
+   * 自定义空数据占位view
+   * @param isLoadFailed 是否加载失败：true: 加载失败，false: 加载成功
+   */
+  ['empty']?: (props: ZPagingParams.EmptySlotProps) => any
+
+  // ******************** 全屏Loading Slot ********************
+  /**
+   * 自定义页面reload时的加载view
+   * - 注意：这个slot默认仅会在第一次加载时显示，若需要每次reload时都显示，需要将auto-hide-loading-after-first-loaded设置为false
+   */
+  ['loading']?: () => any
+
+  // ******************** 返回顶部按钮Slot ********************
+  /**
+   * 自定义点击返回顶部view
+   * - 注意：此view受“【返回顶部按钮】配置”控制，且其父view默认宽高为76rpx
+   * @since 1.9.4
+   */
+  ['backToTop']?: () => any
+
+  // ******************** 虚拟列表&内置列表Slot ********************
+  /**
+   * 内置列表中的cell
+   * - use-virtual-list或use-inner-list为true时有效
+   * @param item 当前item
+   * @param index 当前index
+   * @since 2.2.5
+   */
+  ['cell']?: (props: ZPagingParams.InnerListCellSlotProps) => any
+
+  /**
+   * 内置列表中的header(在cell顶部且跟随列表滚动)
+   * - use-virtual-list或use-inner-list为true时有效
+   * @since 2.2.5
+   */
+  ['header']?: () => any
+
+  /**
+   * 内置列表中的footer(在cell顶部且跟随列表滚动)
+   * - use-virtual-list或use-inner-list为true时有效
+   * @since 2.2.5
+   */
+  ['footer']?: () => any
+
+  // ******************** 聊天记录模式Slot ********************
+  /**
+   * 使用聊天记录模式时自定义顶部加载更多view(除没有更多数据外)
+   * - use-chat-record-mode为true时有效
+   * @param loadingMoreStatus 底部加载更多状态：default:默认状态 loading:加载中 no-more:没有更多数据 fail:加载失败
+   */
+  ['chatLoading']?: (props: ZPagingParams.ChatLoadingSlotProps) => any
+
+  /**
+   * 使用聊天记录模式时自定义没有更多数据view
+   * - use-chat-record-mode为true时有效
+   * @since 2.7.5
+   */
+  ['chatNoMore']?: () => any
+}
+
+// ****************************** Methods ******************************
+declare interface _ZPagingRef<T = any> {
+  // ******************** 数据刷新&处理方法 ********************
+  /**
+   * 重新加载分页数据，pageNo恢复为默认值，相当于下拉刷新的效果
+   *
+   * @param [animate=false] 是否展示下拉刷新动画
+   */
+  reload: (animate?: boolean) => Promise< ZPagingParams.ReturnData<T>>;
+
+  /**
+   * 刷新列表数据，pageNo和pageSize不会重置，列表数据会重新从服务端获取
+   *
+   * @since 2.0.4
+   * @returns {Promise<ZPagingParams.ReturnData<T>>} Promise，当前最新分页结果：
+   * - resolve 操作成功
+   * - - `totalList` (T[]): 当前总列表
+   * - - `noMore` (boolean): 是否没有更多数据
+   * - reject 操作失败
+   */
+  refresh: () => Promise<ZPagingParams.ReturnData<T>>;
+
+  /**
+   * 刷新列表数据至指定页
+   *
+   * @since 2.5.9
+   * @param page 目标页数
+   * @returns {Promise<ZPagingParams.ReturnData<T>>} Promise，当前最新分页结果：
+   * - resolve 操作成功
+   * - - `totalList` (T[]): 当前总列表
+   * - - `noMore` (boolean): 是否没有更多数据
+   * - reject 操作失败
+   */
+  refreshToPage: (page: number) => Promise<ZPagingParams.ReturnData<T>>;
+
+  /**
+   * 请求结束
+   * - 当通过complete传进去的数组长度小于pageSize时，则判定为没有更多了
+   *
+   * @param [data] 请求结果数组
+   * @param [success=true] 是否请求成功
+   * @returns {Promise<ZPagingParams.ReturnData<T>>} Promise，当前最新分页结果：
+   * - resolve 操作成功
+   * - - `totalList` (T[]): 当前总列表
+   * - - `noMore` (boolean): 是否没有更多数据
+   * - reject 操作失败
+   */
+  complete: (data?: T[] | false, success?: boolean) => Promise<ZPagingParams.ReturnData<T>>;
+
+  /**
+   * 请求结束
+   * - 通过total判断是否有更多数据
+   *
+   * @since 2.0.6
+   * @param data 请求结果数组
+   * @param total 列表总长度
+   * @param [success=true] 是否请求成功
+   * @returns {Promise<ZPagingParams.ReturnData<T>>} Promise，当前最新分页结果：
+   * - resolve 操作成功
+   * - - `totalList` (T[]): 当前总列表
+   * - - `noMore` (boolean): 是否没有更多数据
+   * - reject 操作失败
+   */
+  completeByTotal: (data: T[], total: number, success?: boolean) => Promise<ZPagingParams.ReturnData<T>>;
+
+  /**
+   * 请求结束
+   * - 自行判断是否有更多数据
+   *
+   * @since 1.9.2
+   * @param data 请求结果数组
+   * @param noMore 是否没有更多数据
+   * @param [success=true] 是否请求成功
+   * @returns {Promise<ZPagingParams.ReturnData<T>>} Promise，当前最新分页结果：
+   * - resolve 操作成功
+   * - - `totalList` (T[]): 当前总列表
+   * - - `noMore` (boolean): 是否没有更多数据
+   * - reject 操作失败
+   */
+  completeByNoMore: (data: T[], noMore: boolean, success?: boolean) => Promise<ZPagingParams.ReturnData<T>>;
+
+  /**
+   * 请求失败
+   * - 通过方法传入请求失败原因，将请求失败原因传递给z-paging展示
+   *
+   * @since 2.6.3
+   * @param cause 请求失败原因
+   * @returns {Promise<ZPagingParams.ReturnData<T>>} Promise，当前最新分页结果：
+   * - resolve 操作成功
+   * - - `totalList` (T[]): 当前总列表
+   * - - `noMore` (boolean): 是否没有更多数据
+   * - reject 操作失败
+   */
+  completeByError: (cause: string) => Promise<ZPagingParams.ReturnData<T>>;
+
+  /**
+   * 请求结束
+   * - 保证数据一致
+   *
+   * @since 1.6.4
+   * @param data 请求结果数组
+   * @param key dataKey，需与:data-key绑定的一致
+   * @param [success=true] 是否请求成功
+   * @returns {Promise<ZPagingParams.ReturnData<T>>} Promise，当前最新分页结果：
+   * - resolve 操作成功
+   * - - `totalList` (T[]): 当前总列表
+   * - - `noMore` (boolean): 是否没有更多数据
+   * - reject 操作失败
+   */
+  completeByKey: (data: T[], key: string, success?: boolean) => Promise<ZPagingParams.ReturnData<T>>;
+
+  /**
+   * 清空分页数据，pageNo恢复为默认值
+   *
+   * @since 2.1.0
+   */
+  clear: () => void;
+
+  /**
+   * 从顶部添加数据，不会影响分页的pageNo和pageSize
+   *
+   * @param data 需要添加的数据，可以是一条数据或一组数据
+   * @param [scrollToTop=true] 是否滚动到顶部，不填默认为true
+   * @param [animate=true] 是否使用动画滚动到顶部
+   */
+  addDataFromTop: (data: _Arrayable<T>, scrollToTop?: boolean, animate?: boolean) => void;
+
+  /**
+   * 【不推荐】重新设置列表数据，调用此方法不会影响pageNo和pageSize，也不会触发请求
+   * - 适用场景：当需要删除列表中某一项时，将删除对应项后的数组通过此方法传递给z-paging
+   *
+   * @param data 修改后的列表数组
+   */
+  resetTotalData: (data: T[]) => void;
+
+  // ******************** 下拉刷新相关方法 ********************
+  /**
+   * 终止下拉刷新状态
+   *
+   * @since 2.1.0
+   */
+  endRefresh: () => void;
+
+  /**
+   * 手动更新自定义下拉刷新view高度
+   * - 常用于某些情况下使用slot="refresher"插入的view高度未能正确计算导致异常时手动更新其高度
+   *
+   * @since 2.6.1
+   */
+  updateCustomRefresherHeight: () => void;
+  
+  /**
+   * 手动进入二楼
+   *
+   * @since 2.8.7
+   */
+  goF2: () => void;
+
+  /**
+   * 手动关闭二楼
+   *
+   * @since 2.7.7
+   */
+  closeF2: () => void;
+
+  // ******************** 底部加载更多相关方法 ********************
+  /**
+   * 手动触发上拉加载更多
+   * - 非必须，可依据具体需求使用，例如当z-paging未确定高度时，内部的scroll-view会无限增高，此时z-paging无法得知是否滚动到底部，您可以在页面的onReachBottom中手动调用此方法触发上拉加载更多
+   *
+   * @param [source] 触发加载更多的来源类型
+   */
+  doLoadMore: (source?: "click" | "toBottom") => void;
+
+  // ******************** 页面滚动&布局相关方法 ********************
+  /**
+   * 当使用页面滚动并且自定义下拉刷新时，请在页面的onPageScroll中调用此方法，告知z-paging当前的pageScrollTop，否则会导致在任意位置都可以下拉刷新
+   * - 若引入了mixins，则不需要调用此方法
+   *
+   * @param scrollTop 从page的onPageScroll中获取的scrollTop
+   */
+  updatePageScrollTop: (scrollTop: number) => void;
+
+  /**
+   * 在使用页面滚动并且设置了slot="top"时，默认初次加载会自动获取其高度，并使内部容器下移，当slot="top"的view高度动态改变时，在其高度需要更新时调用此方法
+   */
+  updatePageScrollTopHeight: () => void;
+
+  /**
+   * 在使用页面滚动并且设置了slot="bottom"时，默认初次加载会自动获取其高度，并使内部容器下移，当slot="bottom"的view高度动态改变时，在其高度需要更新时调用此方法
+   */
+  updatePageScrollBottomHeight: () => void;
+
+  /**
+   * 更新slot="left"和slot="right"宽度，当slot="left"或slot="right"宽度动态改变后调用
+   *
+   * @since 2.3.5
+   */
+  updateLeftAndRightWidth: () => void;
+
+  /**
+   * 更新fixed模式下z-paging的布局，在onShow时候调用，以修复在iOS+h5+tabbar+fixed+底部有安全区域的设备中从tabbar页面跳转到无tabbar页面后返回，底部有一段空白区域的问题
+   *
+   * @since 2.6.5
+   */
+  updateFixedLayout: () => void;
+
+  // ******************** 虚拟列表相关方法 ********************
+  /**
+   * 在使用动态高度虚拟列表时，若在列表数组中需要插入某个item，需要调用此方法
+   *
+   * @since 2.5.9
+   * @param item 插入的数据项
+   * @param index 插入的cell位置，若为2，则插入的item在原list的index=1之后，从0开始
+   */
+  doInsertVirtualListItem: (item: T, index: number) => void;
+
+  /**
+   * 在使用动态高度虚拟列表时，手动更新指定cell的缓存高度
+   * - 当cell高度在初始化之后再次改变时调用
+   *
+   * @since 2.4.0
+   * @param index 需要更新的cell在列表中的位置，从0开始
+   */
+  didUpdateVirtualListCell: (index: number) => void;
+
+  /**
+   * 在使用动态高度虚拟列表时，若删除了列表数组中的某个item，需要调用此方法以更新高度缓存数组
+   *
+   * @since 2.4.0
+   * @param index 需要更新的cell在列表中的位置，从0开始
+   */
+  didDeleteVirtualListCell: (index: number) => void;
+
+  /**
+   * 手动触发虚拟列表渲染更新，可用于解决例如修改了虚拟列表数组中元素，但展示未更新的情况
+   *
+   * @since 2.7.11
+   */
+  updateVirtualListRender: () => void;
+
+  // ******************** 本地分页相关方法 ********************
+  /**
+   * 设置本地分页，请求结束(成功或者失败)调用此方法，将请求的结果传递给z-paging作分页处理
+   * - 若调用了此方法，则上拉加载更多时内部会自动分页，不会触发@query所绑定的事件
+   *
+   * @param data 请求结果数组
+   * @param [success=true] 是否请求成功
+   * @returns {Promise<ZPagingParams.ReturnData<T>>} Promise，当前最新分页结果：
+   * - resolve 操作成功
+   * - - `totalList` (T[]): 当前总列表
+   * - - `noMore` (boolean): 是否没有更多数据
+   * - reject 操作失败
+   */
+  setLocalPaging: (data: T[], success?: boolean) => Promise<ZPagingParams.ReturnData<T>>;
+
+  // ******************** 聊天记录模式相关方法 ********************
+  /**
+   * 手动触发滚动到顶部加载更多，聊天记录模式时有效
+   */
+  doChatRecordLoadMore: () => void;
+
+  /**
+   * 添加聊天记录，use-chat-record-mode为true时有效
+   *
+   * @param data 需要添加的聊天数据，可以是一条数据或一组数据
+   * @param [scrollToBottom=true] 是否滚动到底部
+   * @param [animate=true] 是否使用动画滚动到底部
+   */
+  addChatRecordData: (data: _Arrayable<T>, scrollToBottom?: boolean, animate?: boolean) => void;
+
+  /**
+   * 手动添加键盘高度变化监听
+   * 
+   * @since 2.8.7
+   */
+  addKeyboardHeightChangeListener: () => void;
+
+  // ******************** 滚动到指定位置方法 ********************
+  /**
+   * 滚动到顶部
+   *
+   * @param [animate=true] 是否有动画效果
+   */
+  scrollToTop: (animate?: boolean) => void;
+
+  /**
+   * 滚动到底部
+   *
+   * @param [animate=true] 是否有动画效果
+   */
+  scrollToBottom: (animate?: boolean) => void;
+
+  /**
+   * 滚动到指定view
+   *
+   * @param id 需要滚动到的view的id值，不包含"#"
+   * @param [offset=0] 偏移量，单位为px
+   * @param [animate=false] 是否有动画效果
+   */
+  scrollIntoViewById: (id: string, offset?: number, animate?: boolean) => void;
+
+  /**
+   * 滚动到指定view
+   * - vue中有效
+   *
+   * @since 1.7.4
+   * @param top 需要滚动的view的top值(通过uni.createSelectorQuery()获取)
+   * @param [offset=0] 偏移量，单位为px
+   * @param [animate=false] 是否有动画效果
+   */
+  scrollIntoViewByNodeTop: (top: number, offset?: number, animate?: boolean) => void;
+
+  /**
+   * y轴滚动到指定位置
+   * - vue中有效
+   * - 与scrollIntoViewByNodeTop的不同之处在于，scrollToY传入的是view相对于屏幕的top值，而scrollIntoViewByNodeTop传入的top值并非是固定的，通过uni.createSelectorQuery()获取到的top会因列表滚动而改变
+   *
+   * @since 2.1.0
+   * @param y 与顶部的距离，单位为px
+   * @param [offset=0] 偏移量，单位为px
+   * @param [animate=false] 是否有动画效果
+   */
+  scrollToY: (y: number, offset?: number, animate?: boolean) => void;
+
+  /**
+   * x轴滚动到指定位置
+   * - 非页面滚动且在vue中有效
+   *
+   * @since 2.8.5
+   * @param x 与左侧的距离，单位为px
+   * @param [offset=0] 偏移量，单位为px
+   * @param [animate=false] 是否有动画效果
+   */
+  scrollToX: (x: number, offset?: number, animate?: boolean) => void;
+
+  /**
+   * 滚动到指定view
+   * - nvue或虚拟列表中有效
+   * - 在nvue中的cell必须设置 :ref="`z-paging-${index}`"
+   *
+   * @param index 需要滚动到的view的index(第几个)
+   * @param [offset=0] 偏移量，单位为px
+   * @param [animate=false] 是否有动画效果
+   */
+  scrollIntoViewByIndex: (index: number, offset?: number, animate?: boolean) => void;
+
+  /**
+   * 滚动到指定view
+   * - nvue中有效
+   *
+   * @param view 需要滚动到的view(通过this.$refs.xxx获取)
+   * @param [offset=0] 偏移量，单位为px
+   * @param [animate=false] 是否有动画效果
+   */
+  scrollIntoViewByView: (view: any, offset?: number, animate?: boolean) => void;
+
+  /**
+   * 设置nvue List的specialEffects
+   *
+   * @since 2.0.4
+   * @param args 参见https://uniapp.dcloud.io/component/list?id=listsetspecialeffects
+   */
+  setSpecialEffects: (args: ZPagingParams.SetSpecialEffectsArgs) => void;
+
+  // ******************** nvue独有方法 ********************
+  /**
+   * 与{@link setSpecialEffects}相同
+   *
+   * @since 2.0.4
+   */
+  setListSpecialEffects: (args: ZPagingParams.SetSpecialEffectsArgs) => void;
+
+  // ******************** 缓存相关方法 ********************
+  /**
+   * 手动更新列表缓存数据，将自动截取v-model绑定的list中的前pageSize条覆盖缓存，请确保在list数据更新到预期结果后再调用此方法
+   *
+   * @since 2.3.9
+   */
+  updateCache: () => void;
+
+  // ******************** 获取版本号方法 ********************
+  /**
+   * 获取当前版本号
+   */
+  getVersion: () => string;
+}
+
+declare interface _ZPaging {
+  new (): {
+    $props: AllowedComponentProps &
+      VNodeProps &
+      ZPagingProps
+    $slots: ZPagingSlots
+  }
+}
+
+export declare const ZPaging: _ZPaging
+
+declare global {
+  interface ZPagingRef<T = any> extends _ZPagingRef<T> {}
+  // 兼容v2.8.1之前的旧版本
+  interface ZPagingInstance<T = any> extends _ZPagingRef<T> {}
+}
diff --git a/uni_modules/z-paging/types/index.d.ts b/uni_modules/z-paging/types/index.d.ts
new file mode 100644
index 0000000..7a2092d
--- /dev/null
+++ b/uni_modules/z-paging/types/index.d.ts
@@ -0,0 +1,24 @@
+/// <reference path="./comps.d.ts" />
+declare module 'z-paging' {
+  export function install() : void
+  /**
+   * z-paging全局配置
+   * - uni.$zp
+   *
+   * @since 2.6.5
+   */
+  interface $zp {
+    /**
+     * 全局配置
+     */
+    config : Record<string, any>;
+  }
+  global {
+    interface Uni {
+      $zp : $zp
+    }
+  }
+}
+
+declare type ZPagingSwiperRef = typeof import('./comps/z-paging-swiper')['ZPagingSwiperRef']
+declare type ZPagingSwiperItemRef = typeof import('./comps/z-paging-swiper-item')['ZPagingSwiperItemRef']
\ No newline at end of file
diff --git a/uni_modules/z-tabs/changelog.md b/uni_modules/z-tabs/changelog.md
new file mode 100644
index 0000000..1697db2
--- /dev/null
+++ b/uni_modules/z-tabs/changelog.md
@@ -0,0 +1,9 @@
+## 0.3.0（2024-10-21）
+支持鸿蒙Next
+## 0.2.7（2024-07-18）
+1.`新增` 支持切换rpx&px  
+2.`修复` 宽度小于屏幕时底部tabs位置不正确的问题  
+3.`修复` 偶现的Cannot read property 'left' of undefind的问题
+
+## 0.2.5（2023-01-09）
+修复可能出现的可能出现的与swiper联动时报错node不存在的bug
diff --git a/components/z-tabs/config/index.js b/uni_modules/z-tabs/components/z-tabs/config/index.js
similarity index 100%
rename from components/z-tabs/config/index.js
rename to uni_modules/z-tabs/components/z-tabs/config/index.js
diff --git a/components/z-tabs/z-tabs.vue b/uni_modules/z-tabs/components/z-tabs/z-tabs.vue
similarity index 100%
rename from components/z-tabs/z-tabs.vue
rename to uni_modules/z-tabs/components/z-tabs/z-tabs.vue
diff --git a/uni_modules/z-tabs/package.json b/uni_modules/z-tabs/package.json
new file mode 100644
index 0000000..0e9e24a
--- /dev/null
+++ b/uni_modules/z-tabs/package.json
@@ -0,0 +1,83 @@
+{
+  "id": "z-tabs",
+  "name": "z-tabs",
+  "displayName": "【z-tabs】一个简单轻量的tabs组件",
+  "version": "0.3.0",
+  "description": "全平台兼容，支持nvue、vue3",
+  "keywords": [
+    "tabs"
+],
+  "repository": "https://github.com/SmileZXLee/uni-z-tabs",
+  "engines": {
+    "HBuilderX": "^3.0.7"
+  },
+"dcloudext": {
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": "393727164"
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@zxlee/z-tabs",
+    "type": "component-vue"
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y",
+        "alipay": "n"
+      },
+      "client": {
+        "App": {
+          "app-vue": "y",
+          "app-nvue": "y"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y",
+		  "钉钉": "y",
+		  "快手": "y",
+		  "飞书": "y",
+		  "京东": "y"
+        },
+        "快应用": {
+          "华为": "y",
+          "联盟": "y"
+        },
+        "Vue": {
+            "vue2": "y",
+            "vue3": "y"
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/uni_modules/z-tabs/readme.md b/uni_modules/z-tabs/readme.md
new file mode 100644
index 0000000..b88a608
--- /dev/null
+++ b/uni_modules/z-tabs/readme.md
@@ -0,0 +1,177 @@
+# z-tabs
+
+[![version](https://img.shields.io/badge/version-0.3.0-blue)](https://github.com/SmileZXLee/uni-z-tabs)
+[![license](https://img.shields.io/github/license/SmileZXLee/uni-z-tabs)](https://en.wikipedia.org/wiki/MIT_License)
+
+***
+
+### 反馈qq群(点击加群)：[371624008](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=avPmibADf2TNi4LxkIwjCE5vbfXpa-r1&authKey=dQ%2FVDAR87ONxI4b32Py%2BvmXbhnopjHN7%2FJPtdsqJdsCPFZB6zDQ17L06Uh0kITUZ&noverify=0&group_code=371624008)
+
+***
+
+## z-tabs文档
+
+### 安装
+
+#### 方式1(推荐)：通过uni_modules安装，在插件市场中点击右上角【使用HbuilderX导入插件】即可。 
+
+***
+
+#### 方式2：通过npm安装  
+
+```bash
+//若项目之前未使用npm管理依赖（项目根目录下无package.json文件），先在项目根目录执行命令初始化npm工程
+npm init -y
+
+//安装
+npm install @zxlee/z-tabs --save
+//更新
+npm update @zxlee/z-tabs
+```
+
+然后在`pages.json`中配置`easycom`(注意：下方配置只有在使用npm安装时才需要配置！！！！！)  
+
+```json
+"easycom": {
+    "^z-tabs": "@zxlee/z-tabs/components/z-tabs/z-tabs.vue"
+}
+```
+
+### 基本使用
+
+```html
+<template>
+	<z-tabs :list="list"></z-tabs>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                list: []
+            }
+        },
+        onLoad() {
+            const list = [];
+            for(let i = 0;i < 10;i++) {
+				// list内item支持字符串或对象，下方这个是字符串
+				list.push('tab标题');
+
+				// 如果要展示徽标数，则list中item的数据结构应为：
+				list.push({
+					name: 'tab标题',
+					badge: {
+						// 设置徽标数为6
+						count: 6
+					},
+					// 可以禁用某个item
+					disabled: true
+				});
+            }
+			this.list = list;
+		}
+    }
+</script>
+```
+
+
+
+### props
+
+| 参数                | 说明                                                         | 类型           | 默认值  | 可选值 |
+| :------------------ | :----------------------------------------------------------- | :------------- | :------ | :----- |
+| list                | 数据源数组，支持形如`['tab1','tab2']`的格式或`[{name:'tab1',value:1}]`的格式 | Array          | []      | -      |
+| current             | 当前选中的index                                              | Number\|String | 0       | -      |
+| scroll-count        | list数组长度超过scrollCount时滚动显示(不自动铺满全屏)        | Number\|String | 5       | -      |
+| tab-width           | 自定义每个tab的宽度，默认为0，即代表根据内容自动撑开，单位rpx，支持传100、"100px"或"100rpx" | Number\|String | 0       | 0      |
+| bar-width           | 滑块宽度，单位rpx，支持传100、"100px"或"100rpx"              | Number\|String | 45rpx   | -      |
+| bar-height          | 滑块高度，单位rpx，支持传100、"100px"或"100rpx"              | Number\|String | 8rpx    | -      |
+| bar-style           | 滑块样式，其中的`width`和`height`将被`bar-width`和`bar-height`覆盖 | Object         | {}      | -      |
+| bottom-space        | tabs与底部的间距，单位rpx，支持传100、"100px"或"100rpx"      | Number\|String | 8rpx    | -      |
+| bar-animate-mode    | 【v0.1.5起支持】切换tab时滑块动画模式，与`swiper`联动时有效，点击切换tab时无效，必须调用`setDx`。默认为`line`，即切换tab时滑块宽度保持不变，线性运动。可选值为`worm`，即为类似毛毛虫蠕动效果 | String         | line    | worm   |
+| name-key            | list中item的name(标题)的key                                  | String         | name    | -      |
+| value-key           | list中item的value的key                                       | String         | value   | -      |
+| active-color        | 激活状态tab的颜色                                            | String         | #007AFF | -      |
+| inactive-color      | 未激活状态tab的颜色                                          | String         | #666666 | -      |
+| disabled-color      | 禁用状态tab的颜色                                            | String         | #bbbbbb | -      |
+| active-style        | 激活状态tab的样式                                            | Object         | {}      | -      |
+| inactive-style      | 未激活状态tab的样式                                          | Object         | {}      | -      |
+| disabled-style      | 禁用状态tab的样式                                            | Object         | {}      | -      |
+| badge-max-count     | 徽标数最大数字限制，超过这个数字将变成`badge-max-count`+     | Number\|String | 99      | -      |
+| badge-style         | 徽标样式，例如可自定义背景色，字体等等                       | Object         | {}      | -      |
+| bg-color            | z-tabs背景色                                                 | String         | white   | -      |
+| tabs-style          | z-tabs样式                                                   | Object         | {}      | -      |
+| init-trigger-change | 初始化时是否自动触发change事件                               | Boolean        | true    | false  |
+| unit                | z-tabs中布局的单位，默认为rpx                                | String         | rpx     | px     |
+
+
+
+### events
+
+| 事件名       | 说明                 | 回调参数                                                     |
+| ------------ | -------------------- | ------------------------------------------------------------ |
+| @change      | tabs改变(点击)时触发 | `参数1`:index(当前切换到的index)；<br/>`参数2`:value(当前切换到的value) |
+| @secondClick | tabs二次点击时触发   | `参数1`:index(当前切换到的index)；<br/>`参数2`:value(当前切换到的value) |
+
+### methods
+
+| 方法名              | 说明                                                         | 参数                                   |
+| ------------------- | ------------------------------------------------------------ | -------------------------------------- |
+| setDx               | 根据swiper的`@transition`实时更新底部dot位置                 | swiper的`@transition`中的`e.detail.dx` |
+| unlockDx            | 在swiper的`@animationfinish`中通知`z-tabs`结束多`setDx`的锁定，若在父组件中调用了`setDx`，则必须调用`unlockDx` | -                                      |
+| updateSubviewLayout | 在nvue+安卓中，若在cell中使用`z-tabs`，且页面加载时cell在屏幕之外，因cell的复用机制，可能导致`z-tabs`内部的布局失效：例如底部bar无法显示，此时可在list滚动到一定区域内(例如快显示`z-tabs`)的时候调用此方法以更新其内部布局。其他情况无需调用！ | -                                      |
+
+### slots
+
+| 名称  | 说明         |
+| :---- | ------------ |
+| left  | tabs左侧插槽 |
+| right | tabs右侧插槽 |
+
+### 支持全局配置
+
+* 在`/z-tabs/components/z-tabs/config/index.js`文件中进行配置
+
+```js
+export default {
+	'active-color': 'red'
+}
+```
+
+### 【v0.1.4起支持】底部dot与swiper联动演示
+
+```html
+<template>
+  <z-tabs ref="tabs" :list="tabList" :current="current" @change="tabsChange" />
+  <swiper :current="current" @transition="swiperTransition" @animationfinish="swiperAnimationfinish">
+    <swiper-item class="swiper-item" v-for="(item, index) in tabList" :key="index">
+      xxx
+    </swiper-item>
+  </swiper>
+<template>
+<script>
+	export default {
+		data() {
+			return {
+				tabList: ['测试1','测试2','测试3','测试4'],
+				current: 0, // tabs组件的current值，表示当前活动的tab选项
+			};
+		},
+		methods: {
+			//tabs通知swiper切换
+			tabsChange(index) {
+				this.current = index;
+			},
+			//swiper滑动中
+			swiperTransition(e) {
+				this.$refs.tabs.setDx(e.detail.dx);
+			},
+			//swiper滑动结束
+			swiperAnimationfinish(e) {
+				this.current = e.detail.current;
+				this.$refs.tabs.unlockDx();
+			}
+		}
+	}
+</script>
+```
\ No newline at end of file