关于在vue中使用vue-awesome-swiper和better-scroll和vant遇到的问题

业务场景是vant组件库的Popup弹窗中包裹着vue-awesome-swiper组件，swiper组件中包含better-scroll，轮播swiper是横向滑动的，而better-scroll是纵向滚动。

1.由于vant中的popup弹窗嵌套了better-scroll，导致better-scroll纵向滑动失效，配置一下Popup弹窗的属性即可：

tips：尽量把Popup弹窗挂在到body节点，防止样式错乱。

<van-popup
  v-model="show"
  get-container="body" // 指定挂载的节点
  :lock-scroll="false" // 是否锁定背景滚动
  :close-on-click-overlay="false" // 是否在点击遮罩层后关闭
>

2.由于拖动临界值造成滑动失效或达不到预期效果，所以swiper要加如下属性：

swiperOption: {
    passiveListeners: false, // 用来提升swiper在移动设备的中的scroll表现（Passive Event Listeners），但是会和e.preventDefault冲突，所以有时候你需要关掉它。
    touchAngle: 30, // 允许触发拖动的角度值。默认45度，即使触摸方向不是完全水平也能拖动slide。
    threshold: 12, // 拖动的临界值（单位为px），如果触摸距离小于该值滑块不会被拖动。
}