防止window.scroll多次执行调用

防止window.scroll多次执行调用

在移动端网站开发过程中，经常会用到上拉加载分页数据，这是会通过监听滚动事件来实现。（在ios上滚动事件会被频繁请求）

js

var vum = new Vue({
    el: "#List",
    data: {
        pageIndex:1,
        pageSize:10,
        list:[],
        isTrue: false
    },
    methods: {
        handleScroll: function() {
            var that = this;
            //判断滚动到底部
            if ($(window).scrollTop() >= $(document).height() - $(window).height()) {
                if (that.isTrue) {
                    setTimeout(function() {
                        that.pageIndex++;
                        that.getList();
                    }, 1000);
                    that.isTrue = false;
                }
            }
        },
        getList: function() {
            //
            //.....
            //
            this.isTrue = true;
        },
    },
    //初始化加载
    mounted: function() {
        //监听滚动
        window.addEventListener('scroll', this.handleScroll);
    }
})

当上拉触底的时候会调用handleScroll方法，这时会通过一个变量isTrue来判断是否获取下一页数据，并在获取数据之后再给isTrue设置为true