vue滚动条滚动到最低端加载的方法

vue滚动条滚动到最低端加载的方法


 mounted(){
      /**
       * 监听窗口的高度
       */
      window.addEventListener('scroll',this.handleScroll,true);
    },
    methods: {
      /**
       * 滚动条滚到底部加载的方法
       */
      handleScroll(){
        // 滚动条距离顶部的距离
        let scrollTop = document.documentElement.scrollTop||document.body.scrollTop;
        //变量windowHeight是可视区的高度
        let windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
        //变量scrollHeight是滚动条的总高度
        let scrollHeight = document.documentElement.scrollHeight||document.body.scrollHeight;
        // 当可视区域小于页面的实际高度时，判定为出现滚动条
        if (document.documentElement.clientHeight < document.documentElement.offsetHeight){
          //滚动条到底部的条件
          if(scrollTop+windowHeight===scrollHeight){
            /**
             * 获取推荐商品
             */
            this.getIntroduceProduce(this.$route.params.id);
          }
        }else {
          //当没有滚动条时，加载爆款推荐的商品
          this.getIntroduceProduce(this.$route.params.id);
        }
      },
    ｝