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

|| 版权声明
作者:冰魄
链接:https://www.bp456.cn/66.html
声明:如无特别声明本文即为原创文章仅代表个人观点,版权归《冰魄博客》所有,欢迎转载,转载
THE END
二维码
海报
vue 单页开发 触底检测
创建一个子组件 /*触底子组件 */ var Scroll = { methods:{ scrollEvent(){ ……
<<上一篇
下一篇>>