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

vue多组件监控onresize无效

时间:2023-03-31 17:05:26 vue.js

问题:我在A.vue组件的mounted中设置了window.onresize=function(){...},页面没有报错,但是没有执行的时候浏览器窗口变化功能。window.onresize=function(){console.log(1)}问题原因:我在vue项目中全局搜索了onresize方法,才发现有3个地方是这样写的,其中一个是公共模板组件,导致A组件的onresize没有效果。因此,如果在vue组件中写onresize(其他监听事件类似),需要做到:不要多处使用window.onresize,改用window.addEventListener;在销毁当前组件之前,一定要销毁当前的监听事件;第二个参数需要保持一致,否则会失败。建议使用外部函数。建议代码:window.addEventListener('resize',this.changeSize)beforeDestroy(){window.removeEventListener('resize',this.changeSize)},methods:{changeSize(){...}}optimizeResizeObserver-putlistening事件绑定父元素,不是window上的官方用法和兼容性:https://developer.mozilla.org...看打印:会返回很多关于这个元素的信息给你,使用随便吧!!!简直不要太方便!赶紧换~