Javascript vue js中的时间轴滚动 导出默认值{ 数据（）{ 返回{ listmasters:[]， listmastersscrolls:[]， 滚动位置：空， scrollPosition1:null } }, 挂载：函数（）{ 这是getListMasters（）； window.addEventListener（'scroll'，this.updateScroll）； window.addEventListener（'scroll'，this.updateScroll1）； }, 方法：{ getListMasters:函数（）{ 这是.http.get（'/get listMaster？'）。然后（（响应）=>{ 这个.set（这个'listmasters'，response.data.data.data）； }); }, updateScroll（）{ this.scrollPosition=window.scrollY； 该值为1=950； }, updateScroll1（）{ 如果（window.scrollY>this.scrollPosition1）{ 这是.http.get（'/get-listMaster1？'）。然后（（响应）=>{ 这个.set（这个'listmastersscrolls'，response.data.data.data）； }); } }, } }

每次我在那里滚动大约20个请求到后端，我必须将其限制为0个请求，我必须以3乘3的方式获取时间轴帖子。我已经成功地完成了它，但是每次滚动到后端的请求量都很高

使用去盎司功能。伯特说了什么。在scroll上触发一个XHR请求是一个可怕的想法，因为根据用户的交互，它以多个scroll处理程序调用结束。使用debounce函数。在scroll上触发XHR请求是一个可怕的想法，因为它会根据用户交互以多个scroll处理程序调用结束

<script type="text/babel">
    export default {
        data () {
            return {
                listmasters: [],
                listmastersscrolls: [],
                scrollPosition: null,
                scrollPosition1: null
            }
        },

        mounted: function () {
            this.getListMasters();
            window.addEventListener('scroll', this.updateScroll);
            window.addEventListener('scroll', this.updateScroll1);
        },

        methods: {
            getListMasters: function () {
                this.$http.get('/get-listMaster?').then((response) => {
                    this.$set(this, 'listmasters', response.data.data.data);
                });
            },

            updateScroll() {
                this.scrollPosition = window.scrollY;
                this.scrollPosition1 = 950;
            },

            updateScroll1() {
                if (window.scrollY > this.scrollPosition1) {
                    this.$http.get('/get-listMaster1?').then((response) => {
                        this.$set(this, 'listmastersscrolls', response.data.data.data);
                    });
                }
            },
        }
    }
</script>