谷歌浏览器切换tab栏时页面释放内存导致echarts不显示问题

  • 在初始化echarts时添加下述监听
vue 复制代码
// 添加事件监听器
      document.addEventListener("visibilitychange", this.handleVisibilityChange);

handleVisibilityChange() {
      if (document.visibilityState === 'visible') {
        // 页面处于活动状态,手动触发图表的更新或重新绘制的代码

        this.chart.resize(); // 如果是 echarts 图表,可以使用 resize() 方法重新绘制
      }
    },
  • 在销毁echarts时移除监听

    // 在需要移除事件监听器的时候调用下面这行代码
    document.removeEventListener("visibilitychange", this.handleVisibilityChange);

具体查看vue 封装echarts

相关推荐
90后的晨仔9 小时前
uni-app 跨端布局与适配技术指南
前端
油丶酸萝卜别吃14 小时前
utils.js 说明文档
开发语言·javascript·ecmascript
zyplayer-doc16 小时前
VuePress类静态文档站和动态知识库怎么选:两种技术路线的适用场景
javascript·人工智能·后端·安全·智能手机
紫禁玄科17 小时前
Shai-Hulud:npm生态的自我复制蠕虫风暴
前端·npm·node.js
东风破_18 小时前
后端API没写好,前端难道干等着吗?
前端
百变梦仔18 小时前
从读项目到纠偏交付:我把 Codex 前端任务闭环升级成了第二版
前端
用户9385156350718 小时前
从前后端分离到前端接口工程:React + MockJS + Vite 解析
前端·后端·全栈
用户9385156350718 小时前
从零在浏览器里跑 DeepSeek-R1:WebGPU + Transformers.js 全链路实战(三)
前端·react.js·typescript
excel18 小时前
当前端行情变差,我们为什么还要坚持?
前端
鸿是江边鸟,曾是心上人19 小时前
快速搭建HTTPS本地开发环境
前端