mounted中window.onresize不生效

软件发布|下载排行|最新软件

当前位置:首页IT学院IT技术

mounted中window.onresize不生效

王维璋   2022-06-03 我要评论

mounted中window.onresize不生效

在vue开发中,因为引用的父组件和子组件都使用了window.onresize以至于一个window.onresize失效。

解决方案

可以采用下面的方式

window.onresize = () => this.screenWidth = window.innerWidth 
// 改为以下写法
window.addEventListener('resize', () => this.screenWidth = window.innerWidth, false)

window.onresize被覆盖问题

多个子组件中都存在window.onresize时,后一个会把前一个覆盖,导致之前的onresize都失效。

    const _this = this
    window.onresize = function() {
      if (_this.chart) {
        _this.chart.resize()
      }
    }

解决方案

使用addEventListener方法添加监听

    const _this = this
    window.addEventListener('resize', () => {
      if (_this.chart) {
        _this.chart.resize()
      }
    })

以上为个人经验,希望能给大家一个参考,也希望大家多多支持。

Copyright 2022 版权所有 软件发布 访问手机版

声明:所有软件和文章来自软件开发商或者作者 如有异议 请与本站联系 联系我们