vue項目錨點定位+滾動定位

文來自：https://blog.csdn.net/qq_43369797/article/details/98966790

功能：

 

 

 HTML：

 

 

 js：

scrollEvent(e) {
        let scrollItems = document.querySelectorAll('.condition-container')
        for (let i = scrollItems.length - 1; i >= 0; i--) {
          // 判斷滾動條滾動距離是否大於當前滾動項可滾動距離
          let judge = e.target.scrollTop >= scrollItems[i].offsetTop - scrollItems[0].offsetTop
          if (judge) {
            this.activeClass = i
            break
          }
        }
        // 滾動條觸底了
        if (e.srcElement.scrollTop + e.srcElement.offsetHeight === e.srcElement.scrollHeight) {
          this.activeClass = 4 - 1
        }
      },
      getActiveClass(index) {
        this.activeClass = index
        let jump = document.querySelectorAll('.condition-container')
        jump[index].scrollIntoView({ block: 'start', behavior: 'smooth' })
      }