当前位置: 首页 > Web前端 > vue.js

vue多子组件监听父组件事件

时间:2023-04-01 00:08:28 vue.js

需要做一个title天花板效果,在多个子组件中获取相同的父组件DOM,监听滚动事件//child.vue循环多次mounted(){//this.taskListApp父组件实例$refs['task-content_scroll']dom.onscroll=()=>{console.log('scoll')this.handlerScroll()}}在最后一个组件中只执行一次?为什么?觉得应该是Vue。jsz=注册事件相关,改成下面的写法letdom=this.taskListApp.$refs['task-content_scroll']dom.addEventListener('scroll',()=>{this.handlerScroll()})完美,多次触发。但为什么?去vue、js文档看注册事件相关,没有原因。我还以为应该是活动报名方式的区域吧?检查addEventListener的区域和注册事件?addEventListener它允许为一个事件注册多个监听器示例:ooxx

window.onload=function(){varbox=document.getElementById("box");box.onclick=function(){console.log("我是box1");}box.onclick=function(){box.style.fontSize="18px";console.log("我是box2");}}//运行结果:“我是box2”第二次onclick覆盖第一次onclickwindow.onload=function(){varbox=document.getElementById("box");box.addEventListener("click",function(){console.log("我是box1");})box.addEventListener("click",function(){console.log("我是box2");})}运行结果:我是box1我是box2addEventListener可以多次绑定同一个事件,不会覆盖之前的事件。