贴图
大概实现这种使用swiper做tab切换,数据页面下拉刷新的效果。
官方提供的scroll-view作为容器,如果在scroll-view使用onPullDownRefresh实现下拉刷新,会存在页面刷新卡,并且刷新会出现在tab之上,用户体验极差。
这里先来一波参考文档:
scroll-view微信官方文档
scroll-view下拉组件—来自其他大神自己封装的组件,强推!实现思路还是scroll-view
以下代码为示例,并非图片效果,图片效果需要根据自己业务修改
具体实现:
1、下载scroll-view下拉组件将所需要的x-scroll-view组件拷至自己项目对应的component文件目录下。
2、页面json文件中引用组件:
"usingComponents": {
"x-scroll-view": "../path/x-scroll-view"
}
3、.wxml中使用组件:
<x-scroll-view refreshing="{
{refreshing}}" style='height:1000rpx;' nomore="{
{nomore}}" bindpulldownrefresh="_onPullDownRefresh" bindscroll="_onScroll">
<view style='min-height:1100rpx'>
<block wx:for="{
{colors}}" wx:for-i