程序员经验分享-hwhale

vue中tab页签切换导致echarts被压缩的问题

2023-11-13

问题描述

vue中使用tab进行页签切换，echarts图表的宽度设为100%的情况下，图表出现压缩变形的情况。

解决方案：

1. 设置静态的宽度

 使用vm单位来设置宽度

vm与“%”的区别：
 两个效果大致相同。

  • ‘%’：对于父元素
  • ‘vm’：对于浏览器

2. v-if

 利用v-if值切换来重绘图形页面。

	<van-tabs
          v-model="active"
          title-active-color="#303135"
          title-inactive-color="#8d8e90"    
        >
          <van-tab title="国资口径" name="state">
            <Artificial v-if="active == 'state' "/>
          </van-tab>
          <van-tab title="管理口径" name="management">
            <Artificial v-if="active == 'management'" />
          </van-tab>
        </van-tabs>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

Bug

echarts

vuejs

javascript

vue中tab页签切换导致echarts被压缩的问题 的相关文章

  • 继续使用 sketch.js 编辑草图图像 [关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 我正在使用 sketch js 中的示例 http intridea github io sketch js http intridea g

  • 为什么电子邮件正文给出不同的输出？

    我正在尝试触发来自 Google 应用程序脚本的电子邮件 const body HtmlService createHtmlOutput A b new task b have been added to the Task Manager

  • 使用 AppleScript 单击 safari 网页按钮

    我想弄清楚如何单击网页中的按钮 例如 点击谷歌网页中的 手气不错 按钮 这是我尝试过的 tell application Safari make new document with properties URL https www goog

  • 如何通过 JS 中的 WebPack 包提供全局 TypeScript 类

    我目前正在研究 TypeScript 我想用 TS 替换 JS 但是我有很多 JS 文件 所以我只想在 TS 中创建新类 并想在我的旧 JS 文件 atm 中使用这些类 后来我想把所有的JS都换成TS 我对 webpack 和捆绑的 js

  • 录制视频和音频并上传到服务器

    我想为网站添加视频录制功能 我一直在搜索并尝试所有可能的可用解决方案 但还没有任何工作正常 我已经尝试过以下解决方案 WebRTC 我知道使用 WebRTC 我们可以从网络摄像头和麦克风获取流 我发现了很多关于相同内容的文章 但没有一篇解释

  • 将字符串转换为整数数组

    我想转换以下字符串 14 2 到一个由两个整数组成的数组中 我该怎么做 现代浏览器的快速浏览器 14 2 split map Number 14 2

  • Scrapy Splash，如何处理onclick？

    我正在尝试抓取以下内容 我能够收到响应 但我不知道如何访问以下项目的内部数据以抓取它 我注意到访问这些项目实际上是由 JavaScript 和分页处理的 这种情况我该怎么办 下面是我的代码 import scrapy from scrapy

  • 如何在流星运行时编译新模板？

    如何使用 Handlebars js 在流星中运行时编译新模板 var source

  • 正则表达式匹配除括号中的单词之外的所有单词 - javascript

    我使用以下正则表达式来匹配所有单词 mystr replace W s g function match p1 index title 请注意 单词可以包含特殊字符 例如德语变音符号 如何匹配除括号内的单词之外的所有单词 如果我有以下字符串

  • “调用”C:\Program Files\nodejs\\node.exe”错误

    我一直在尝试安装节点js并安装浏览器同步 C Users Aly gt npm install g browser sync CALL C Program Files x86 nodejs node exe C Program Files

  • 量角器检查元素是否不存在

    我在基于角度的网站中有一个设置可以打开和关闭下拉菜单 如果关闭 则不会显示在主页上 对于量角器 我需要检查开关关闭时该元素是否不存在 但是 我不应该陷入 未找到元素 错误 因为它是一组许多测试中的一个 我该怎么做 我曾尝试这样做 expec

  • 设置 D3 力定向图

    致尊敬的读者 我对 javascript 相当陌生 我也遇到过这个问题 我正在尝试实现这个力导向图的修改版本 http mbostock github com d3 ex force html http mbostock github co

  • 对数组进行分组并获取计数[重复]

    这个问题在这里已经有答案了 假设我有这样的数组 foo bar foo bar bar bar zoom 我想将其分组 这样我就可以得到这样的计数 foo 2 bar 4 zoom 1 有没有一个实用程序可以做到这一点 只需使用该功能Arr

  • Vim、Javascript、DoctorJS (jsctags) 和 Taglist（源代码浏览）

    我已经安装了DoctorJS http doctorjs org 之前jsctags 试图为 Vim 获得一些好的源代码浏览 标签列表 使用Taglist http www vim org scripts script php script

  • 在相同位置使用 jQuery 将列表框项目移动并删除到另一个列表框

    我有 2 个多选框 如本链接所示 http jsfiddle net bdMAF 38 http jsfiddle net bdMAF 38 function button1 click function list1 gt option s

  • 在 GeoJson 数据接收到的 Google 地图多边形上放置标签

    我想将带有信息的标签 或带有标签的 div 放在由下面的代码片段绘制的多边形上 样式属性已成功应用于要素 多边形类型 有谁知道如何向该特征添加文本并将其显示在多边形的中心 function handleGeoJson data map da

  • 如何检查令牌过期和注销用户？

    当用户单击注销按钮时 他 她可以自己注销 但是如果令牌过期 他 她就无法注销 因为在我的应用程序中 令牌在服务器端和前端都使用 当用户单击注销按钮时 如果令牌有效 则服务器和浏览器中的令牌都会被清除 当用户未注销并且他 她的令牌过期但未在浏

  • iOS Javascript 引擎 parseFloat(1) 返回负数

    这段代码将使错误出现 function causeBug d var k var n parseFloat 1 var c Math abs d if n lt 0 k else k return k n function for var

  • 如何在 Firefox 插件上使用 jQuery 1.5.2+？

    首先 我创建了一个接收参数并返回 jQuery 的函数 例如 function getjQuery window jquery code window return window jQuery 但后来我收到了一封评论电子邮件 他们告诉我必须

  • 如何使用javascript取消设置变量？ [复制]

    这个问题在这里已经有答案了 这是我到目前为止所尝试的 var nxt I am next window onscroll function var scr this pageYOffset if scr gt 400 console log

随机推荐

热门标签