vue 单页开发 触底检测

创建一个子组件

    /*触底子组件    */
var Scroll = {
                methods:{
                            scrollEvent(){
                                if (document.documentElement.scrollTop
                                     + document.documentElement.clientHeight 
                                    >= document.body.scrollHeight) {
                                    this.$parent.onBottom();
                                }
                            }
                        },
                        mounted(){
                                    window.addEventListener('scroll', this.scrollEvent,false);
                                },
                        destroyed () {
                                    window.removeEventListener('scroll', this.scrollEvent,false);
                            },
                template:`
                    <div class="scroll"></div>
                `
            };

添加一个方法

 destroyed () {window.removeEventListener('scroll', this.handleScroll)},

父组件里注册组件

components:{'scroll':Scroll},

切记 切记:把子组件标签放到最下面

脚手架开发触底检测参考:https://blog.csdn.net/Sallywa/article/details/89674985

发表评论 / Comment

用心评论~