Skip to content
当前文档uni-app 版coolui-scroller-uni 改用 原生微信小程序版 →

组件总览 / 命名对照

uni-app 版组件与原生微信小程序版一一对应,能力与配置项一致;标签统一加 coolui-scroller- 前缀,个别组件的保留字属性做了改名(详见与原生微信小程序版的差异)。

命名对照表

功能uni-app 标签原生微信小程序(目录)文档
滚动容器coolui-scrollercoolui-scroller/scroller/index文档
列表项(水波纹)coolui-scroller-itemcoolui-scroller/item/index文档
长列表窗口化(推荐)coolui-scroller-longlist原生无同名组件(对应 scroll-page 的思路)文档
长列表分页(旧方案)coolui-scroller-pagecoolui-scroller/scroll-page/index文档
空列表占位coolui-scroller-emptycoolui-scroller/empty/index文档
手势提示coolui-scroller-handtipcoolui-scroller/handtip/index文档
加载更多coolui-scroller-loadmorecoolui-scroller/loadmore/index文档
下拉刷新coolui-scroller-refreshcoolui-scroller/refresh/index文档
下拉视差coolui-scroller-parallaxcoolui-scroller/parallax/index文档
分类导航coolui-scroller-navcoolui-scroller/nav/index文档
顶部导航栏coolui-scroller-nav-barcoolui-scroller/nav-bar/index(原生无独立文档页)文档
切换容器coolui-scroller-nav-pannelcoolui-scroller/nav-pannel/index文档
搜索框coolui-scroller-search(属性是 keywordcoolui-scroller/search/index文档
排序筛选coolui-scroller-sort / coolui-scroller-sort-itemcoolui-scroller/sort/index + coolui-scroller/sort/item文档
下拉二楼coolui-scroller-second-floor / coolui-scroller-second-floor-refreshcoolui-scroller/second-floor/index(+ second-floor-refresh文档
回到顶部coolui-scroller-back-to-topcoolui-scroller/backToTop/index文档

公共约定

  • 引入:配好 easycom 后直接写标签,无需 import;也可全局注册或页面内局部引入。
  • 事件:原生 bind:xxx 在这里写成 @xxx;受控属性通过 @update:propName 同步,可简写为 v-model:propName
  • 插槽:插槽名与原生一致(#header#refresh#empty#loadmore#backToTop 等),保持组件的嵌套层级即可,无需额外配置。
  • 组件通信:原生用 relations 自动关联父子组件,uni-app 版改为 Vue provide/inject,所以层级关系不要打乱。
  • 样式:原生 externalClasses 在这里换成 virtualHost + apply-shared,页面里覆盖组件内部样式请用 :deep(...)
  • 类型:公共类型集中在 types.d.ts,可 import type { CooluiScrollerProps, CooluiRefreshConfig } from 'coolui-scroller-uni/types'

各组件详细属性与示例见左侧「组件」下的独立页面。