【6 ElementUI Tabs控件第二个tab页签Div宽度缩小的问题】

news/2025/3/5 9:43:09/

背景

在使用ElementUI的Tabs 控件时,发现第二个tabs 内容的Div宽度用的百分比,然后就会缩小,导致内容变形,这边的处理方法就是拿到一个tabs 内容的div的offsetWidth,然后将这个width赋值给第二个Div的width即可。

代码

<el-tabs v-model="leftActiveName" type="card"><el-tab-pane label="红榜-菜单" name="first" style="width: 100%"><div id="divPageTopAsc" style="width: 100%; height: 40vh"></div></el-tab-pane><el-tab-pane label="黑榜-菜单" name="second" style="width: 100%"><div id="divPageTopDesc" style="width: 100%; height: 40vh"></div></el-tab-pane></el-tabs>
 // 组件加载完async mounted() {// 设置tab 两个div的宽度var widthValue = document.getElementById("chartlRight").offsetWidth;document.getElementById("divUserTopDesc").style.width = widthValue + "px";document.getElementById("divPageTopDesc").style.width = widthValue + "px";}

http://www.ppmy.cn/news/1117437.html

相关文章

QGraphicsView使用的问题

环境 QT5.15.2VS2019_64 最近使用QGraphicsView时遇到了一些问题,特此记录. 功能和问题如下: 1.实现在鼠标当前位置为中心缩放 核心就是记录鼠标位置对应ViewPos,先缩放(以视图中心),然后根据记录位置,将场景移动到鼠标位置即可. auto preViewPos mapFromGlobal(QCursor…

uni-app 之 解决u-button始终居中问题

uView中u-button始终居中问题如何解决的简单方法&#xff1f; 1&#xff1a;给该元素margin-right: 0;可以达到向右靠齐&#xff1b; 2&#xff1a;给该元素的父元素设置float: right image.png <u-button style"width: 50px; margin-left: 0;" plain"t…

OpenAI开发系列(二):大语言模型发展史及Transformer架构详解

全文共1.8w余字&#xff0c;预计阅读时间约60分钟 | 满满干货&#xff0c;建议收藏&#xff01; 一、介绍 在2020年秋季&#xff0c;GPT-3因其在社交媒体上病毒式的传播而引发了广泛关注。这款拥有超过1.75亿参数和每秒运行成本达到100万美元的大型语言模型&#xff08;Large …

Linux之ASCII码表查询tools(五十九)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 人生格言&#xff1a; 人生…

mac安装virtualenv和virtualenvwrapper

1.安装(推荐用sudo安装&#xff0c;直接pip3安装会有坑) sudo pip3 install virtualenv sudo pip3 install virtualenvwrapper 2.查看python virtualenvwrapper.sh 位置 # 查看python默认解释器 which python3 # 查看virtualenvwrapper.sh which virtualenvwrapper.sh 3.打…

华为OD:求字符串中所有整数的最小和

输入字符串s&#xff0c;输出s中包含所有整数的最小和。 说明&#xff1a; 字符串s&#xff0c;只包含a-z A-Z-&#xff1b; 合法的整数包括&#xff1a; 正整数一个或者多个0-9组成&#xff0c;如 0 2 3 002 202负整数负号-开头&#xff0c;数字部分由一个或者多个0-9组成…

科普丨OTP语音芯片和语音合成芯片的区别

语音芯片根据集成电路类型来分,凡是与声音有关系的集成电路被统称为语音芯片(又称语音IC,这里应该叫成Voice IC),但是在语音芯片的大类型中,又被分为语音IC(这里应该叫成Speech IC),音乐IC(这里应该叫成Music IC)两种。 一、OTP语音芯片 OTP(One Time Programable)是指一次性可…

【AI】机器学习——支持向量机(非线性及分析)

5. 支持向量机(线性SVM) 文章目录 5.4 非线性可分SVM5.4.1 非线性可分问题处理思路核技巧核函数特点 核函数作用于SVM 5.4.2 正定核函数由 K ( x , z ) K(x,z) K(x,z) 构造 H \mathcal{H} H 空间步骤 常用核函数 5.5 SVM参数求解算法5.6 SVM与线性模型关系 5.4 非线性可分SVM …