el-tabs

el-tabs el-tabs 插槽自定义

el-tab-pane的el-tabs__nav-scroll是ElementPlus中el-tabs组件的内部结构，如果你想在el-tabs导航部分(el-tabs__nav-scroll)中添加自定义元素
昕er·2024-09-07 09:55

el-tabs element-ui 标签页增加按钮

先看效果其他的标签页导出//导出按钮的样式::v-deep.el-tabs__nav{width:100%;}::v-deep.el-tabs__item.is-top:last-child{float:right;}
山城️777·2024-02-09 07:22

axios封装取消请求的方式

问题:项目中涉及tab切换页,tab1和tab2列表数据字段相同,所以一般使用el-tabs组件;el-tabs中的每一项el-tab是通过v-for遍历产生的,所有的每一项el-tab中的table表格数据使用的是一个
和科比合砍81分·2024-02-08 12:28

解决vue切换页面echarts不显示

问题描述：vue3项目中用el-tabs组件切换页面，echarts图表只在初始化的时候显示了一次，切换页面后就不显示了。
小珏酱·2024-02-02 02:58

【Echarts】Echarts 图表宽度设置100%，图表显示只有100px的问题

【Echarts】Echarts图表宽度设置100%，图表显示只有100px的问题问题原因解决经常遇到的场景：v-if和el-tabs切换图表不显示图表；问题原因图表的父容器设置了display：none
香菜啵子欸·2024-01-30 13:45

vue3 el-tabs 点击触发事件

杨幂刘恺威赵丽颖constactiveName=ref('first')//默认选择第一个consttabsArray=reactive({first:true,third:false,second:false,})//点击事件consthandleClick=(tab:any)=>{constconvert=JSON.parse(JSON.stringify(tab.props))if(conv
圆脸喜欢吃菠萝·2024-01-28 03:47

Vue3 动态设置 ref

el-tabs中如果用v-for动态增加tab，每个tab中如果需要控制自己控件的增删改查，就需要设置动态ref.1.先定义一个空字典：constinputRefMap=ref({});2.然后定义一个方法将变量增加到字典中
Mr_TianSDQ·2024-01-18 17:38

echarts 控制图例显示隐藏以及自适应的方法

当echarts的组件放在el-tabs里面的el-tab-pane切换时，echarts的自适应会跟不上，所以每次回到echarts重新调用resize()方法5656importChartsfrom
ChanJcy·2024-01-18 12:49

使用ElementUI的el-tab+vxe-table表格+复选框选择

首先进来是全部清空的状态的点击左边选择不同项右边会实时发送接口获取数据填充表格复选的内容可以保留显示，比如A的1勾选后切换到B再切换回来A的1仍然是勾选状态说实话官网的setCheckboxRow方法我实现不了，这里就是纯蠢蠢的办法实现，在这里做个记录，能用咱就用着，有更好的办法就下次一定适用el-tabs
一个大萝北·2024-01-16 17:13

Vue 修改 Element-UI 组件的原生样式

最近，我在使用el-tabs组件嵌套el-table时，又遇到了这种问题，具体表现为：我在子标签页（el-tab）中插入表格（eltable）后，页面表格的宽度显示异常。
Hemist·2024-01-14 02:17

VUE3+element plus在el-tab-pane中增加自定义图标

目录实现效果实现思路实现效果例如提供多种付款方式，使用el-tabs标签进行内容切换，标签头加上图标体验更好实现思路elementplus官网上提供了以下在el-tab-pane增加icon的样例，其中
尘烟生活家·2024-01-13 08:41

elementui中的tab标签通过某一页的按钮进行跳转、切换到不同的tab标题

1、首先就是需要在你的tab标题添加一个name属性，用字符串的数字比较方便2、在el-tabs这个里面绑定这个属性值3、data里面写上这个属性，将来就是通过这个进行判断跳转的这里默认是“1”就是默认展示第一页的
hat-ing·2024-01-12 19:39

记录：利用css改变el-tabs自定义样式，背景色、激活选中样式、tab底部蓝条横线样式等

原生样式：修改后样式：利用css改变el-tabs样式，背景色、激活样式等，代码如下可直接复制用户管理配置管理角色管理定时任务补偿css://修改el-tabs.my-tabs>>>.el-tabs__
一架打字机·2024-01-07 08:18

ElementUI使用el-tabs进行路由跳转时动态修改页签的标题

目录需求描述分析及尝试效果实现需求描述最近在做使用若依的管理系统框架做项目，在做前端的一个需求的时候发现，在路由跳转时，发现的title只能设置为常量，在进行了不少的搜索依旧没找到如何将title值设置为变量的方法，可是当我需要根据点击的不同链接显示成不同的title应该怎么办呢？后来也发现了可以在vue的生命周期中做些文章，主要的思路就是将要显示的title值也作为参数通过路由传过去，再对其进行
试着奔跑的菜鸟·2024-01-05 10:22

在vue中使用elementUI饿了么框架使用el-tabs，切换Tab如何实现实时加载

当我们在开发中遇到tab切换，这时候用el的el-tabs感觉很方便但当我在把代码都写完后，发现一个问题就是页面打开时虽然我们只能看见当前一个tab页，但是vue会帮你把你写的所有tab页的内容都渲染出来了
七度丢失的梦·2024-01-05 00:47

vue3 + Element-plus + Echarts 5.2 切换不更新、导出PDF不显示 解决方案

vue3+Element-plus+Echarts5.2切换不更新、导出PDF不显示解决方案1、使用el-tabs切换导致Echarts不显示问题2、折线图Echarts不更新问题3、异常抛出：Uncaught
前端早间课·2024-01-04 17:31

el-tabs(标签栏)的入门学习

el-tabs(标签栏)的入门学习适用场景与导航栏相似，项目中常见的是点击某个导航栏，主页面（el-main）模块的最上方会显示我们的标签栏集合，点击不同的导航栏，标签栏会在不断追加，若点击到标签集合中已存在
自律最差的编程狗·2023-12-24 03:20

在el-tabs中echarts图表宽高设置style=“width: 100%； height: 100%“不起效变成100px的问题

问题解决方案在使用ECharts时，将图表嵌套在el-tabs中，遇到宽高设置不起效的问题，有可能是下面三个原因导致的。一、确保在图表初始化前容器已渲染确保在图表初始化之前，图表容器的大小已经确定。
鹤渺·2023-12-23 05:11

VUE仿造element-ui el-tabs标签页选项卡样式

因为某个bug以为是el-tabs组件的问题，所以想直接仿造一个，结果发现是其他问题，想想下次哪天会用到就奉上这段样式这是用VUE写的。看得懂的用JQ写其实逻辑都一样没区别！
一只喵de旅行·2023-12-22 02:15

解决element ui中el-tabs标签点击切换闪屏问题

现象：点击切换elementui中el-tabs时候，table会出现闪一下的状况；初始elementui中el-tabs组件代码如下：使用v-if="activeName==='first'"解决闪屏改造后代码如下
齐天qaq·2023-12-15 18:13

echart图表动态获取数据，异步渲染数据，并在el-tabs标签页展示，解决标签页切换之后echart收缩问题

第二个标签页在进入页面时，在mounted里调用方法sortGet，获取柱状图的数据，第一个标签页在el-tabs点击时，执行的@tab-click=“handleClick”方法中获取数据。
清幽子·2023-12-04 05:36

avue-tabs设置默认选中的tab

结果竟然发现element-ui中el-tabs的v-model在avue-tabs中竟然是没有用的，无法设置默认选中哪个tab。
小马甲丫·2023-12-03 08:28

【记录el-tabs+el-tree+el-scrollbar横向滚动条不出来的问题】

el-tree定义一个class,之后设置css为width:max-content;min-width:100%;然后在el-scrollbar上设置滚动条的高度,因为默认高度是100%,有可能导致在el-tabs
靐齉齾麤龘龖龗鱻爩·2023-11-26 16:50

使用 Element-UI 的 el-tabs 组件，浏览器页面卡死

当时使用的版本是：[email protected]、[email protected]升级[email protected]后，打开在一个页面居然卡死了，页面里面使用了element-ui的el-tabs组件；去掉el-tabs
扛着煤气去救火·2023-11-24 20:23

vue实现el-menu与el-tabs联动

效果图如下：当标签栏很多的时候效果图如下：左侧菜单布局（$route.path高亮显示激活路由:default-active="$route.path"）{{item.title}}{{item.subtitle1}}{{item.subtitle1}}模拟数据如下：（以下路径均需在router/index.js里面进行配置）menuList:[{id:"9",subtitle1:"首页",ico
吃葡萄不吐葡萄皮嘻嘻·2023-11-23 01:08

vue 多个el-tabs切换时表格加载慢

近日前端遇到一些问题，客户提出问题：当出现多个el-tab时，里面的el-table加载总是会实实在在的看到表格宽度的变化，让用户体验不是很好。于是看帖子https://blog.csdn.net/chuxuan0215/article/details/100522348找到了解决方案主要是这段话延迟100毫秒加载表格布局。setTimeout(()=>{this.$refs.tableMachi
战战的坚果·2023-11-14 07:27

前端基础学习-tab嵌套表格错乱问题

最近开发有遇到过一个问题，在运用elementui的时候，当我们把多个table页面作为嵌套到el-tabs下时，切换tab会有错乱问题（这里的现象是切换的一瞬间，所以列缩小到最小，页面出现大量空白）。
小夭。·2023-11-10 17:27

element-ui el-tabs 和 el-table混合使用的问题

最近在使用vue的element-ui前端框架中的el-tabs和el-table混合使用，发现了很多小问题。
Bynine9·2023-11-10 17:49

el-tabs 实现多个 el-table表格 分页操作

一，下面是图片效果我们每个el-tab-pane都是一个表格需求，每个表格都实现分页；然后我的表格有三个状态：成功失败待处理然后是我实现的分页数据二，下面直接看代码导出{{tools.getDkeyValue(businessDetails_state,scope.row.state_id)}}0":total="totalSum":page.sync="Successtotal.pageNum"
万众瞩目.·2023-11-05 01:10

el-tabs 默认选中第一个

1.实际开发中el-tabs都会设置第一个为默认值,这样会好看一点,而渲染的数据经常是通过后端返回的数据,v-model无法写死默认值解决办法,通过计算机属性,在data定义一个selectedTabwatch
沙尘暴炒饭·2023-11-02 00:06

elementPlus | el-tabs 标签管理路由页面

import{useRouter}from'vue-router'constrouter=useRouter()consttabClick=(tab)=>{constidx=tab.indexif(idx==0){router.push('/')}...}参考：elementuitab标签管理路由页面_this.$tab.openpage-CSDN博客vue+elementUIel-tabs标签路
要加油哦～·2023-10-29 18:00

element的tabs组件使用问题解决

1.去除el-tabs组件自带的键盘切换功能今天在使用element的tabs组件时，发现这个tab组件自带了按键盘左右方向，切换tab的功能，可以通过使用@keydown.native.capture.stop
未来@音律·2023-10-28 20:52

el-tabs和＜component＞配合，实现tab栏的切换效果

component标签是Vue框架自定义的标签，它的用途就是可以动态绑定我们的组件，根据数据的不同更换不同的组件。标签里的is属性值是对应的组件名称。component标签详细使用方法：https://blog.csdn.net/liangmengbk/article/details/85013547是element的ui组件，通过@tab-click方法，改变is的值`exportdefault
heiKeWangZi1368·2023-10-27 18:03

element-ui中的el-tab和el-table样式冲突导致table高度缩小

解决element-ui中在tab切换时table出现高度、宽度缩小的问题今天我在使用element-ui中的el-tabs组件进行切换时，el-table会出现一个默认高度，导致table最下方多出一行空白行
乱八七糟的学习·2023-10-25 15:33

踩坑笔记：vue+element ui 使用tabs 浏览器卡死

一行一行的删除检查，定位到竟然是是el-tabs这个组件有问题，然后赶紧百度，看到一条很亲切的回答于是改成下面的代码，果然问题解决了，神坑！！！分享出来避免大家踩坑......
脚本小子·2023-10-21 20:34

elementui——el-tabs固定高度&内容超出高度可滚动条

注意.el-tabs–card是外层.el-tab-pane是每一个tabs内容的容器，这
HD243608836·2023-10-21 09:17

element+vue小技巧和报错解决(持续更新~建议收藏)

default="{row}"4-一键清空表单数据6.表格的排列7.关于某些时候el-table超出内容区后不显示进度条的问题8.关于el-button只用来跳转路由地址，不传参9-局部插件导入（连写）10.关于el-tabs
请叫我欧皇i·2023-10-19 03:44

vue-element-ui中el-tabs标签在刷新页面后回到刷新前的标签页

在原创的基础上稍稍改动了一下本文是为了记录曾经踩过的坑，愿以后的日子里不再踩坑大家在用element-ui的tab切换时，可能会遇到这样的问题，就是比如我在标签页2新增了东西，要刷新页面，但是刷新后回到标签页1，这样又要点回去，就很麻烦，我遇到时是用下面的方法解决的，可能会很low，毕竟我还是个vue小白，如果哪个大神有更好的解决方法，请不吝赐教，感激不尽～思路是这样的：我希望可以通过url后的参
xiaoma121212·2023-10-12 15:20

element-ui el-tabs响应式数据不起作用

本文档记录element-ui升级导致的问题前端开发过程中，项目有时不得不升级element-ui，本以为升级很简单，然而发现升级后会存在一些问题1.element-ui从4.2版本左右升级到7.11版本导致el-tabs
柠檬家的芒果果·2023-10-12 08:59

VUE+Element-ui实战之el-tabs切换实时加载el-table表格数据

实战场景描述实际开发过程中，需要Tab切换不同类型的数据，如果是每个Tab表单是静态数据还好，但通常情况下基本上涉及的都是table数据，页面打开时，我们看到的是一个打开的Tab内容，但其实vue是把所有的内容都渲染了，只是其他都隐藏了，这种可能就会造成打开页面时因为需要同时加载多个数据而卡顿，最佳实现思路肯定是Tab切换时才进行实时加载。1、确定好每个Tab内容参考官网的例子改成我们的内容就好2
菜鸟茜·2023-10-11 15:35

element-ui el-tabs组件中el-table列宽度闪屏问题

问题element-ui框架，当tabs中有table组件的时候，点击tabs的标签时，table组件存在列宽从小变大的有闪屏现象问题原因导致这个问题的原因有两个：el-table组件的子级容器el-table__header、el-table__body有初始的默认宽度，不是100%而是一个具体的像素宽度，导致无法撑满，是因为手动设置列宽导致的：如，因为表格默认有个宽度计算，如果手动设置了某个或
星沉大海@T·2023-10-11 07:18

el-tabs(标签栏)的入门学习

el-tabs(标签栏)的入门学习适用场景与导航栏相似，项目中常见的是点击某个导航栏，主页面（el-main）模块的最上方会显示我们的标签栏集合，点击不同的导航栏，标签栏会在不断追加，若点击到标签集合中已存在
ok060·2023-10-08 05:09

＜el-tabs＞tab切换的使用

最近在写vue的项目，项目中有遇到element-ui。所以vue和element-ui都是新手菜鸟级选手，下面将的使用方法总结如下：如图所示，切换tab时，页面效果：代码如下：用户管理配置管理角色管理定时任务补偿exportdefault{data(){return{activeName:'first'};},methods:{handleClick(tab,event){console.log
笑到世界都狼狈·2023-10-06 01:35

Element-ui标签页中使用ECharts无法渲染DOM的原因和解决方法总结

今天在elementui的el-tabs标签页中使用ECharts的折线图时遇到这样一个问题：图表无法正常渲染，控制台报can'tgetDOMwidthorheight.查了很多方法都没有解决，最后问了个有经验的大佬才解决问题
此间的少年258·2023-10-05 12:15

vue如何实现el-menu与el-tabs联动，通过点击el-menu导航中的选项动态添加el-tabs页面

Vue如何实现el-menu与el-tabs联动，通过点击el-menu导航中的选项动态添加tab页面老规矩，先上效果图！
YodgeGGG·2023-10-05 05:04

vue 实现顶部tab栏菜单（顶部tab按钮）切换（添加删除nav数据，适配微前端应用，滑动动画，右键菜单弹窗）

首先为了在样式效果上实现方便，这里决定使用element-ui的el-tabs标签来做。这样只需要改下样式，其他效果例如切换动画都能保存。
东扯葫芦西扯瓜·2023-10-04 16:41

element-ui源码阅读-Tabs 标签页

1.tabs使用在研究源码前，先看下tabs是如何使用的，一个标签栏主要由el-tabs和el-tab-pane两个组件组成，绑定一个变量用于设置显示的tab，变量的值对
写前端的大叔·2023-10-01 20:55

vue element 双重el-tabs 加 时间线

记录：HTML//双重tabs循环{{e.identity}}：{{e.name}}{{e.date}}{{e.time}}意见：{{e.option}}JS//根据状态显示不同iconcomputed:{iconStatus(){return(status)=>{switch(status){case'1':return'iconfonticonxiangmutongji'case'2':ret
谢先生丶nsyw·2023-09-27 00:45

优化用户体验：解决element中el-tabs组件切换闪屏问题

然而，在使用element中的el-tabs组件时，相信有不少开发者都会遇到切换时的闪屏问题。
水星记_·2023-09-26 01:45

修改 element-ui 组件 el-tabs 的选项卡字体大小样式无效的问题解决办法

1、问题如图所示：el-tabs的选项卡字体默认大小为14px，想修改它的大小，一般的方法就是重写el-tabs__item该类的样式，在加个！
氨基钠·2023-09-24 04:13
上一页 1 2 3 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他