Element el-table 表格内容 样式错乱的问题

news2024/11/24 3:09:11

表格切换样式错乱展示

因为切换行的高度变化可能未异步渲染

在这里插入图片描述

解决方法: 在需要使用v-if渲染的el-table-column元素上加上一个不重复的key值即可解决问题 :key=“Math.random()”

在这里插入图片描述


  <el-table-column
            prop=""
            label="问题"
            width="630.5px"
            :key="Math.random()"
            show-overflow-tooltip
            v-if="activeTab == 3"
          >
            <template>
              <div>这件商品怎么样好用嘛?</div>
            </template>
          </el-table-column>
          <el-table-column
            prop=""
            label="回答"
            width="630.5px"
            :key="Math.random()"  //注意在这
            v-if="activeTab == 3"
          >
            <template>
              <div>
                你好<br />
                你好<br />
                <img
                  src="@/assets/Vector.png"
                  alt=""
                  style="width: 123px; height: 123px"
                />
              </div>
            </template>
          </el-table-column>
          

到那时如果key是:key="Math.random()"这样的弹窗关闭的时候会出现闪烁 key的值唯一就好了 不建议随机

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1092063.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

你不一定知道的四种遍历进程的方法(c语言)

一、前言 有时候写代码的时候&#xff0c;我们需要遍历出系统的一些进程&#xff0c;一般我们是直接在任务管理器中查看&#xff0c;不过我们也可以自己写一个&#xff0c;下面小编将会从三个方面着手&#xff0c;给大家讲讲如何遍历进程。 二、系统快照 一般会用到了3个关键…

智慧公厕管理系统

在当今快速发展的科技时代&#xff0c;智慧城市管理成为了城市发展的重要趋势。而智慧公厕管理系统作为其中的一个重要组成部分&#xff0c;为公共卫生设施的管理提供了全新的解决方案&#xff0c;引领着智慧城市管理科技的新篇章。 一、智慧公厕管理系统的概念 什么是智慧公…

【基于windows desktop上的docker配置nacos,并采用宿主机访问】

1、拉取镜像&#xff08;以下命令全部基于powershell&#xff09; docker pull nacos/nacos-server2、启动容器 docker run -d -e PREFER_HOST_MODEhostname -e MODEstandalone -e JVM_XMS256m -e JVM_XMX256m -e JVM_XMN128m -p 8848:8848 --name nacos --restartalways nac…

VL53L5CX驱动开发(3)----检测阈值

VL53L5CX驱动开发----3.检测阈值 概述实现demo视频教学样品申请源码下载生成STM32CUBEMX选择MCU串口配置IIC配置 INT设置配置使能与复位X-CUBE-TOF1串口重定向代码配置TOF代码配置Kcps/SPAD定义状态说明演示结果 概述 本章展示如何使用VL53L5CX近接传感器的"检测阈值&quo…

vscode用密钥文件连接ssh:如果一直要输密码怎么办

commandshiftP&#xff1a;打开ssh配置文件 加上这么一段&#xff0c;host就是你给主机起的名字 对IdentityFile进行更改&#xff0c;改成相应的密钥文件 然后commandshiftP链接到主机就可以了 但是有时候它会让输入密码 这是由于你给这个IdentityFile的权限太多了&#xf…

【VTK】基础知识分析

很高兴在雪易的CSDN遇见你 &#xff0c;给你糖糖 欢迎大家加入雪易社区-CSDN社区云 前言 本文分享VTK基础操作技术&#xff0c;记录vtk编程中常用的接口&#xff0c;变量等的创建及使用方法希望对各位小伙伴有所帮助&#xff01; 感谢各位小伙伴的点赞关注&#xff0c;小易…

程序包org.apache.commons.XXX不存在

看了好几个博客找这个出现的原因&#xff0c;最后亲测有用的&#xff1a; [IDEA]Java&#xff1a;“程序包XXX不存在”问题的三种解决方案 - lodalo - 博客园 (cnblogs.com) 使用第一种方式&#xff0c;不需要重启&#xff0c;就是在这个条件下输入&#xff1a;mvn idea:idea…

Ruby语言基础知识

Ruby是一种简单快捷的面向对象脚本语言&#xff0c;由日本人松本行弘&#xff08;Yukihiro Matsumoto&#xff09;在20世纪90年代开发&#xff0c;遵守GPL协议和Ruby License。它的灵感和特性来自于Perl、Smalltalk、Eiffel、Ada以及Lisp语言。 以下是Ruby语言的一些特点&#…

Mini小主机All-in-one搭建教程1-安装Esxi7.0虚拟机系统

Mini小主机All-in-one搭建教程1-安装Esxi7.0虚拟机系统 最近小主机似乎很火&#xff0c;知名不知名的品牌&#xff0c;都出了各自的小主机。今天主要介绍小主机下搭建教程安装Esxi、Openwrt、群晖NAS、Win11、centos7、黑苹果、Android-x86系统&#xff0c;这戏系统 搞得好是…

嵌入式C语言自我修养《GNU C编译器扩展语法》学习笔记

目录 一、C语言标准和编译器 二、指定初始化 三、宏构造“利器”&#xff1a;语句表达式 四、typeof与container_of宏 五、零长度数组 六、属性声明&#xff1a;section 七、属性声明&#xff1a;aligned 一、C语言标准和编译器 C语言标准的发展过程&#xff1a; ●…

想要精通算法和SQL的成长之路 - 前缀和的应用

想要精通算法和SQL的成长之路 - 前缀和的应用 前言一. 区域和检索 - 数组不可变二. 二维区域和检索 - 矩阵不可变2.1 前缀和的计算2.2 用前缀和计算二维区域和 三. 矩形区域不超过 K 的最大数值和 前言 想要精通算法和SQL的成长之路 - 系列导航 一. 区域和检索 - 数组不可变 原…

c# xml 参数读取的复杂使用

完整使用2 生产厂家里面包含很多规格型号,一个规格型号里面包含很多出厂序列号,点击下一步如果检测到填充的和保存的不一样 就新增一条(如检测到生产厂家相同,但是规格型号不同,就新增一组规格型号)。 界面一:新增界面 界面2 删除界面 界面一:新增界面 load 其中…

导入Maven项目遇到的一些问题及解决

开发工具是IDEA&#xff0c; 一个Maven项目初次导入IDEA中&#xff0c;需要注意的几件事&#xff1a; 设置项目的编码格式&#xff08;或者提前设置全局的编码格式&#xff09;&#xff0c;一般是UTF-8&#xff1b;检查JDK版本和编译级别&#xff1b;检查Maven的版本&#xf…

centos7下安装elasticsearch7.8.1并配置远程连接

1、下载安装包 sudo wget https://artifacts.elastic.co/downloads/elasticsearch/elasticsearch-7.8.1-linux-x86_64.tar.gz 2、解压 sudo tar -zxvf elasticsearch-7.8.1-linux-x86_64.tar.gz 3、添加用户并设置密码 sudo useradd es sudo passwd es # 设置密码 Lida15…

NewStarCTF2023week2-Upload again!

尝试传修改后缀的普通一句话木马&#xff0c;被检测 尝试传配置文件 .htaccess 和 .user.ini 两个都传成功了 接下来继续传入经过修改的木马 GIF89a <script language"php"> eval($_POST[cmd]); </script> 没有被检测&#xff0c;成功绕过 直接上蚁剑…

课题学习(八)----卡尔曼滤波动态求解倾角、方位角

一、 卡尔曼滤波 卡尔曼滤波的应用要求系统和底层过程的测量模型都是线性的。离散时间线性状态空间系统的描述为: x k Φ k , k − 1 x k − 1 G k − 1 w k − 1 x_k\Phi_{k,k-1}x_{k-1}G_{k-1}w_{k-1} xk​Φk,k−1​xk−1​Gk−1​wk−1​    式中 Φ k , k − 1 \Phi_{…

原创先锋后台管理平台未授权访问

漏洞描述 原创先锋后台管理平台存在未授权访问漏洞&#xff0c;攻击者通过漏洞可以任意接管账户权限 漏洞复现 访问未授权的url&#xff1a; /admin/admin/admin_list.html漏洞证明如下&#xff1a; 文笔生疏&#xff0c;措辞浅薄&#xff0c;望各位大佬不吝赐教&#xff0…

智慧公厕云管理平台:公厕云大脑引领厕所革命未来之路

智慧公厕作为城市管理的重要组成部分&#xff0c;不仅为市民提供便利&#xff0c;更是城市形象的重要窗口。随着科技的发展&#xff0c;全域联网管理的智慧公厕云管理平台指挥大脑的建立&#xff0c;使得智慧公厕的跨区域、跨系统、跨业务、跨流程作业功能更加强大&#xff0c;…

Linux shell编程学习笔记12:布尔运算和逻辑运算

Linux Shell 脚本编程和其他编程语言一样&#xff0c;支持算数、关系、布尔、逻辑、字符串、文件测试等多种运算。前面几节我们陆续研究了 Linux shell编程 中的 字符串运算、算术运算和关系运算&#xff0c;今天我们来研究 Linux shell编程中的的布尔运算、逻辑运算。 一、…

COM编程入门Part Ⅱ - 深入理解COM服务器[译]

文章目录 1. 本文的目的 2. 介绍 3. 快速浏览COM服务器 4. 服务器生命周期管理 5. 实现接口&#xff0c;从IUnknown开始 6. CoCreateInstance()的内部 7. 注册COM服务器 8. 创建COM对象 - 类工厂 9. 示例自定义接口 10. 客户端使用我们的COM服务 11. 其他细节 本篇…