Consult the paging scheme of better-scroll horizontal scrolling

Mobile projects, scrolling components use better-scroll
because the amount of data is too large to use paging
horizontal scrolling, so it is necessary to configure scrollX as the true attribute,
but if you lose this attribute, you cannot use the pullingUp event.
so I use the scrollEnd event to request new data
to get the new data when the current position + 50 is greater than or equal to maxScrollX. After calling the refresh method
each time the five pieces of data
code is as follows

      this.$nextTick(() => {
        if (!this.scroll) {
          this.scroll = new BScroll(this.$refs.wrapper, {
            click: true,
            scrollX: true
          })
          const maxScrollX = this.scroll.maxScrollX
          this.scroll.on("scroll", (pos) => {
            console.log(pos, "scroll pos")
          })
          this.scroll.on("scrollEnd", (pos) => {
            if (pos.x < maxScrollX + 50 && this.activityList.length < this.total){
              this.$emit("loadMore", "activity")
              this.scroll.refresh()
            }
          })
        }
      })
  
  devtoolsdombetter-scroll
  
  dom
Aug.12,2021
Menu