更新记录

0.0.1（2026-05-02）

新增

• 新增滚动加载组件 zm-scroll。
• 支持下拉刷新、上拉加载、加载状态和无更多状态。
• 支持错误状态展示和重试。
• 支持 resetUpScroll() 重置上拉加载。
• 支持 endSuccess(count, hasNext) 和 endErr() 结束加载状态。
• 支持 scrollTo(y) 滚动到指定位置。

优化

• 补充完整首页 demo，覆盖重置加载、回到顶部、列表追加和无更多截图场景。
• 完善插件市场发布配置、平台兼容性、授权价格和文档说明。

注意

• 当前是轻量滚动容器，不等同于完整 mescroll 生态实现。
• 嵌套滚动、Tab 内滚动和弹层内滚动需要单独复测。

平台兼容性

uni-app(5.08)

uni-app x(5.08)

其他

滚动加载组件

zhuanz-mescroll 提供滚动容器、下拉刷新、上拉加载和滚动控制能力。

适合列表页、消息页、商品流、内容流等需要统一管理“刷新、加载更多、错误重试、无更多状态”的页面。

组件

• zm-scroll

核心能力

• 下拉刷新
• 上拉加载
• 加载中状态
• 错误重试
• 无更多状态
• 滚动到指定位置
• 重置上拉加载

安装路径

uni_modules/zhuanz-mescroll

基础示例

<template>
  <zm-scroll ref="scroll" @down="refresh" @up="loadMore">
    <view v-for="item in list" :key="item.id">
      {{ item.title }}
    </view>
  </zm-scroll>
</template>

<script>
export default {
  data() {
    return {
      list: [],
      page: 0
    }
  },
  methods: {
    refresh() {
      this.page = 0
      this.list = []
      this.loadMore()
    },
    loadMore() {
      requestList({ page: this.page + 1 })
        .then(res => {
          this.page += 1
          this.list = this.list.concat(res.list)
          this.$refs.scroll.endSuccess(res.list.length, res.hasNext)
        })
        .catch(() => {
          this.$refs.scroll.endErr()
        })
    }
  }
}
</script>

Props

Events

Methods

平台兼容性

• uni-app Vue2 / Vue3：支持
• H5：支持
• App Vue：支持
• 微信小程序：支持
• 支付宝小程序：支持
• uni-app x：支持 Web 和 App，需按实际项目运行环境验证

注意事项

• 当前组件是轻量滚动容器，不等同于完整 mescroll 生态实现。
• 业务侧请求成功后需要调用 endSuccess()。
• 业务侧请求失败后需要调用 endErr()。
• Tab 内滚动、弹层内滚动、复杂嵌套滚动建议单独验证。