踩坑日记

前言

生活中，工作中，总会遇到许许多多出乎意料的事情，好事就妙，坏事就坑。在此记录遇到的坑。

在开发Taro小程序时，ScrollView设置纵向滚动，ScrollView中的Swiper组件设置横向轮播，当手指在Swiper上下滑动时，无法触发ScrollView的纵向滚动。

• 解决方法
  在Swiper中设置css就可以了

  .swiperCustomClass {
      touch-action: pan-y; /* 允许垂直滚动 */
  }

在开发小程序时，ScrollView内嵌套ScrollView无法非常丝滑的进行滚动，因为有滚动惯性。

• 解决方法，避免使用这种布局:)

在小程序中，fixed布局是以scroll-view为基准的，意味着，如果你设置fixed的top为0，随着scroll-view往下滑动，不会固定在屏幕顶部

• 解决方法
  使用position: sticky固定

在小程序中，使用wx.getMenuButtonBoundingClientRect()获取胶囊距离屏幕顶部的高度在半屏小程序中获取的top错误

• 在onLoad中延迟获取

  setTimeout(() => {
    const rect = uni.getMenuButtonBoundingClientRect()
    this.paddingTop = rect.top
    this.height = rect.height
  },0)