解决小程序swiper高度无法自适应

一、思路：动态获取swiper子元素高度、将获取的子元素高度赋值给swiper。
二、实现：
1、设置统一方法设置swiper 高度：

// 获取swiper高度
const getSwiperHeight = (p, element) => {
  console.log('p----------');
  console.log(p,element);
  //创建节点选择器
  let query = wx.createSelectorQuery();
  //选择id
  let that = p;
  query.select(element).boundingClientRect(
    function (e) {
      console.log(e);
      that.setData({
        swiperHeight: e.height+20+ 'px'
      })
    }).exec();
}

2、swiper内容：

<swiper style="height: {{swiperHeight}}" duration="{{duration}}" current="{{currentTab}}" bindchange="swiperChange">
    <block wx:for="{{tabList}}" wx:key="index">
      <swiper-item>
        //内容区域设置动态类、便于获取内容高度
        <view class="swiper-item{{index}}">
          <block wx:if="{{currentList.length > 0}}" wx:key="index">
            <block wx:for="{{currentList}}" wx:key='index'>
              <view class="record-wrap" bindtap="waitGoCode" data-item='{{item}}'>
                <view class="card-wrap record-item border-radius10">
                  <view class="{{'color'+item.payment_type.index}}">
                    <text>{{item.payment_type.name1}}</text>
                    <text>{{item.payment_type.name2}}</text>
                  </view>
                  <view class="record-item-info">
                    <view>
                      <text class="textWeight">收款金额：</text>
                      <text class="textRed">￥{{item.market_price}}</text>
                    </view>
                    <view>
                      <text class="textWeight">客户姓名：</text>
                      <text>{{item.user ? item.user.chinese_name : '无'}}</text>
                    </view>
                  </view>
                </view>
              </view>
            </block>
            <ReachBottomTip></ReachBottomTip>
          </block>
          <block wx:if="{{currentList.length == 0}}" wx:key="index">
            <EmptyTip></EmptyTip>
          </block>
        </view>
      </swiper-item>
    </block>

3、每次获取最新数据时调通用函数设置swiper高度：
例：

 onLoad: async function (options) {
    await this.getPaymentTotal()
    await this.getPaymentRecord()
    //等获取完数据、再设置高度！！！
    // 动态设置swiper高度
    getSwiperHeight(this,'.swiper-item'+this.data.currentTab)
  },
  所以每次保障获取完数据后再调用赋值swiper高度的方法！

4、坑

 /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },
  最好不要在这个函数中设置高度、异步加载数据、子内容高度还没有完全形成、在readey中已经获取节点元素高度可能不准确！
  所以每次保障获取完数据后再调用赋值swiper高度的方法！