学了前端挺久了。近期写一个项目測试系统，布局时发现自己对变宽+固宽的布局还没有全然掌握，所以在这里总结一下，以后须要的时候回头看看。1.最简单的当然是一列或多列固宽比如两列固宽：<1>.设置一个外围div——container。是两列显示的总大小，能够是固定800px等值。<2>.在container内分别设置两个div——side、content依据须要设置像素，比方一个
一、需求使用element-ui 的 table组件实现自定义列 + 固定列功能 这里只有解决方案，没有追根溯源，为啥嘞？ 因为我菜 T.T二、解决方案直接上才艺 ①动态切换表格时，（随机性的）导致固定列塌陷（固定列的内容会坠下来），使用doLayout() 方法解决，具体如下： 在 vue的 updated 中调用即可，也有在mounted，beforeUpdate中调用的，自行尝试。updat
转载
2024-02-20 16:57:26
526阅读
文章目录前言：需求 前言：写项目的时候有一个需求，就是当el-table的滚动条滑动的时候，可见区域如果没有该列则固定到左侧，由elementUi官方网站可知el-table固定一列的代码如下:fixed为主要的标识 头部固定设置的是table的高度<template>
<el-table
:data="tableData"
style="width: 10
转载
2024-02-11 21:45:22
809阅读
在我们开发PC端的项目使用表单时，尤其是crm系统，应该经常会遇到这样的需求， 用户需要根据设置来自定义显示列。 查了element的官方文档， 并没有此类组件， 所以手动封装了一个简单的组件， 希望能在大家开发此类需求时能够有所帮助。效果图具体效果图如下：自定义显示列 (可实现拖拽进行排序，点击选中，再次点击取消选中)按照用户已设置好的字段排序/显示/隐藏每一列setTable组件首先实现拖拽
转载
2024-02-08 15:23:22
158阅读
文章目录ElementUI 表格示例：一个基本的表格el-table的属性el-table-column的属性带状态表格多级表头获取表格，重点说下！！！单选多选排序筛选自定义列展开行 ElementUI 表格前置工作： 安装好vue和elemetUI。如果是按需引入，请确保Table、TableColumn模块已经引入示例：一个基本的表格<template>
<el-table
转载
2024-04-02 10:25:41
180阅读
element-table横滚轴固定显示问题描述：最近用elementui中的el-table组件，因为表格中的列比较多，所以表格会有横滚轴，这问题就来了。如果我想看拖动横滚轴的话，我必须要将页面拖到表格底部，再拖动横滚轴，然后再将页面滚到上面查看被遮挡的信息。。。设想：如果当数据表的数据超出窗口显示区域时，横滚轴固定显示到可视区域的底部，那就方便多了。解决思路：从网上看他们是这么解决的： el-
转载
2024-05-02 21:17:39
813阅读
Customize configuration项目打包 新建vue.config.js文件
module.exports = {
publicPath: './',
outputDir: 'dist',
assetsDir:'static'
}
使用命令打包 npm run build
或者使用vue ui 在浏览器上打包
日期格式化
添加过滤器 filtersel
转载
2024-06-19 21:07:16
210阅读
环境：Visual Studio 2015，.NET Framework 4.5.2，ASP.NET MVC5，Vue.js，Element UI 什么叫可变列表格？顾名思义，就是Table的Column的数量是可变的，可能是3个、4个，或者5个。如下图：那么，可变列列表的应用场景是什么？通常，在开发的过程中，总是会遇到在一个列表中根据不同的用户角色和业务场景，展示不
转载
2024-07-05 22:15:42
408阅读
今天在搬砖的时候发现了一个问题，当用el-table组件画表格，并且存在合并行时，鼠标浮动的高亮样式有些问题，如下图。 可以看到虽然已经合并成为了一行但是，高亮部分的显示样式仍然是分家状态。由于我画的表格需要有固定列，虽然百度了一些大神的方法，但是仍然没有完全解决我的问题。 找了好久，发现了两个可以解决同时包含固定列和合并列表格高亮错位问题的方法。方法一<template>
<
转载
2024-07-05 17:56:29
449阅读
背景Element UI 是 PC 端比较流行的 Vue.js UI 框架，它的组件库基本能满足大部分常见的业务需求。但有时候会有一些定制性比较高的需求，组件本身可能没办法满足。最近在项目里就碰到了。很多页面都需要用到表格组件el-table。如果没有给el-table-column指定宽度，默认情况下会平均分配给剩余的列。在列数比较多的情况，如果el-table宽度限定在容器内，单元格里的内容就
转载
2024-02-24 17:37:57
1847阅读
elementui的table表格固定列错乱解决 这个错误主要就发生在safari浏览器上，谷歌浏览器的一些版本上（应该是它的低一些的版本），还有微信打开的浏览器上。 错误原因：业务上的数据过长，需求是显示两行，其余的以省略号形式，并且要求在鼠标放在这行数据上时提示里面呢可以显示完整信息。 发生固定
原创
2021-05-20 22:31:00
6018阅读
点我在线体验Demo(请用电脑查看)亲测苹果电脑，chrome浏览器无卡顿现象，其它浏览器并未测试，如遇到卡顿请备注系统和浏览器，方便我后续优化，谢谢先看一下效果,一共1000 X 100 = 10W个单元格基本感受不到卡顿，而且每个单元格点击可以编辑，支持固定头和固定列
Github项目源代码 觉得可以就Star一下,哪里有问题也欢迎指出，感谢解决问题核心点：根据可视区域，横向滚动加载，竖向滚动
转载
2024-10-21 18:26:46
49阅读
element-ui_圣杯布局 目录 文章目录1、圣杯布局2、element-ui布局组件2.1、常用属性3、element-ui实现圣杯布局***后记*** ： 内容 1、圣杯布局圣杯布局（Holy Graid Layout)指的是一种最常见的网站布局。页面从下而下，分成三个部分：头部（header)，躯干（body），尾部（footer）。其中躯干又分成三栏，从左到右为：导航、主栏、副栏。效
转载
2024-06-05 06:28:41
139阅读
文章目录实现思路相关代码系列文章 此案例基于 基于element-ui的分页表格组件，增加了动态列的功能。实现思路 实现动态列本质上是控制列的显隐状态，如果是使用jQuery的话，无非是操作dom。目前使用的是vue，其屏蔽了dom的操作，允许我们通过变量间接的操作dom。 之前实现过一个版本，形式类似这位仁兄写的博文（此链接），而且我是封装成了组件，父子级组件的数据、属性设置甚是繁杂。想
转载
2024-05-10 16:59:48
54阅读
前言之前有些过移动端的项目搭建的文章，感觉不写个pc端管理系统老感觉少了点什么，最近公司项目比较多，恰巧要做一个申报系统的后台管理系统，鉴于对vue技术栈比较熟悉，所以考虑还是使用vue技术栈来做；看过一个不错的后台配置模板（vue-element-admin），页面也挺美的，但是还是碍于不想看太多关于这个模板的配置说明，于是又拉出来之前我搭建的简易版的模板，决定重构下，使用自己搭建的后台系统模板
一、ElementUI1. ElementUI简介 我们学习VUE,知道它的核心思想式组件和数据驱动,但是每一个组件都需要自己编写模板,样式,添加事件,数据等是非常麻烦的, 所以饿了吗推出了基于VUE2.0的组件库,它的名称叫做element-ui,提供了丰富的PC端组件ElementUI官网：http://element-cn.eleme.io/#/zh-CN 注1：类似前端框架还有iview2
转载
2024-10-21 12:41:01
329阅读
文章目录**Element-UI快速入门****一、Element-UI简介****二、安装Element-UI****三、引入Element-UI****四、使用Element-UI组件****五、自定义Element-UI组件样式****六、Element-UI布局组件****七、Element-UI表单组件****八、插槽（Slots）和主题定制****九、Element-UI的响应式布局
转载
2024-06-29 20:42:37
198阅读
当一个表格展示的数据相当多的时候，经常会用到固定列，固定行的事情 原理 是 两个或者多个表格组合行程 固定行或者固定列的情况
原创
2022-09-22 16:06:35
1316阅读
Table固定表头
只要在
el-table元素中定义了
height属性，即可实现
固定表头的表格，而不需要额外的代码。
例如：
<el-table
:data="tableData3"
height="250"
border
style="width: 100%">
...
</el-table>这里文档
转载
2024-02-22 12:40:58
2090阅读
前言 最近在做一个文件上传的功能，后端接口写好了、发现前端上传文件的页面不会写……（刚接触）然后我就找解决方案，后面找发现Element有个组件是<el-upload/>能直接上传文件。 我就想直接用拿来改成自
