微信小程序学习笔记四（持续更新）---征服scroll-view下拉刷新

贴图

大概实现这种使用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-index="index" wx:key="index">
         	<view c