batter-scroll的组件化以及基本用法踩坑

记录一下使用"better-scroll"时遇到的坑

记录一下使用"better-scroll"时遇到的坑使用场景：项目需要使用到了better-scroll 要求页面滑动顺畅，支持上拉刷新、下拉加载 已经返回到指定位置

前人的坑：一开始并没有使用better-scroll 而是用的vant 的组件，同样支持上拉刷新、下拉加载 但是在点击返回到指定位置 和点击详情返回时出现了问题，无法记录滑动位置以及定位不到指定元素位置

better-scroll写法

先将其写成组件

然后我们在页面中引用

....中间是滑动区域填充



import Scroll from "../../components/scroll";

  components: {

    "scroll-box": Scroll

  },

computed:{

scroller(){

      return this.$refs.wrapper.scroll;

    },

}

值得一提的是，在页面反复前进后退的时候 ，可能会造成组件计算高度不及时 造成页面无法滑动的情况，这个时候我们需要在activated生命周期中重新手动刷新组件，来完成组件的高度计算

  activated() {

    this.scroller.refresh()

  }

基本上就这么多了，先记录一下