div滚动到底部

    <div
        class="scroll-box"
        @scroll="scrollEvent"
    >
        <div
            v-if="!isEmpty(question_list)"
            class="flex flex-center m-t-20"
        >
            <template v-if="loadStatus == 1">
                <i class="el-icon-loading"></i><span>加载中...</span>
            </template>
            <template v-if="loadStatus == 2">
                <span>没有更多了...</span>
            </template>
        </div>
    </div>

<script>
export default {
        methods: {
            getQuestionList() {
                getList({
                    page: this.list_page,
                    limit: this.list_limit
                }).then(v => {
                    this.list = [...this.list, ...v.data.list];
                    if (v.data.list < this.list_limit) {
                        this.loadStatus = 2;
                    } else {
                        this.loadStatus = 0;
                    }
                });
            },
            scrollEvent(e) {
                const { scrollTop, clientHeight, scrollHeight } = e.target;
                //此时滚动条滚动到底部
                if (scrollTop + clientHeight >= scrollHeight - 50) {
                    //具体的业务逻辑
                    if (this.loadStatus > 0) {
                        return;
                    } else {
                        this.loadStatus = 1;
                        this.list_page++;
                        this.getQuestionList();
                    }
                }
            },
    }
}
</script>

页面滚动

<script>
export default {
    methods: {
    scrollBottom() {
        let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        let clientHeight = document.documentElement.clientHeight;
        let scrollHeight = document.documentElement.scrollHeight;
        if (scrollTop + clientHeight >= scrollHeight) {
            console.log('到底啦')
        }
    },
    }，
    created() {
        window.addEventListener('scroll', this.scrollBottom); 
    },
    destroyed() {
        window.removeEventListener('scroll', this.scrollBottom) //页面离开后销毁监听事件
    }
}
</script>