uni-app下实现小程序版,左右切换tab、上拉加载、

uni-swipe-list

uni-app版,用原生swiper实现左右滑动,movable-area来实现下拉加载,暂只支持小程序实现; 感谢WxP UI提供原生小程序版。

您的 star 是我前进的动力~~.

组件列表 swipe-list组件 tab组件 sroll组件 如何使用

git clone https://github.com/peng20017/uni-swiper-list.git

直接放入 HBuilder X -> 运行 -> 微信小程序

本项目自身就是一个完整的uni-app项目,暂不支持app

组件配置 Scroll 组件 Scroll Attributes
参数 说明 类型 可选值 默认值
requesting 列表数据是否处于加载中 Boolean -- false
end 列表数据加载完成 Boolean -- false
emptyShow 控制空状态显示 Boolean -- false
listCount 当前列表长度 Number -- 0
emptyUrl 空列表的展示图片 String * /assets/image/empty/empty.png
emptyText 空列表的文字提示 String * 未找到数据
hasTop 是否有header Boolean -- false
refreshSize 下拉刷新的高度 Number -- 90
bottomSize 底部高度 Number -- 0
color 颜色 String -- ""
enableBackToTop 双击顶部状态栏回到顶部 Boolean -- false
Scroll Events
事件名称 说明 回调参数
refresh 下拉刷新 --
more 上拉加载 --
Scroll Slots
name 说明
-- 列表组件主体
Tab 组件 Tab Attributes
参数 说明 类型 可选值 默认值
tabData 数据源 Array -- []
tabCur 当前聚焦项索引 Number -- 0
scroll 是否可以超出滚动 Boolean -- false
size tab高度 Number -- 90
color 颜色 String -- ""
Tab Events
事件名称 说明 回调参数
change tab切换事件 当前选中tab的index
Tab Methods
方法名 说明 回调参数
scrollByIndex 让tab组件根据传入的index进行滚动 需要切换tab项的index
贡献

如果有什么好的建议欢迎提issues

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。