vue实时监听屏幕的宽度和移除监听

前端小凯

已于 2023-08-20 01:48:53 修改

阅读量723

点赞数

文章标签： vue.js javascript 前端

于 2023-08-17 15:44:22 首次发布

本文链接：https://blog.csdn.net/qq_43235503/article/details/132342528

版权

window.addEventListener( "事件名" , ( )=>{ }，true/false )；：添加监听事件；

window.removeEventListener( "事件名" , ( )=>{ }，true/false)；：移出监听事件；

第一步：在data里定义宽度

cl_w: document.documentElement.clientWidth || document.body.clientWidth

第二步：在mounted里添加resize监听事件

window.addEventListener("resize",() => {
    return (() => {
        this.cl_w = document.documentElement.clientWidth || document.body.clientWidth; 
    })()
});

第三步：在beforeDestroy里移出resize监听事件

window.removeEventListener("resize",() => {
    return (() => {
        this.cl_w = document.documentElement.clientWidth || document.body.clientWidth; 
    })()
});