提供给用户使用的表格样式自定义工具,适用于elementUI表格
介绍
给用户提供了可以自定义修改elementUI表格的能力,通过混入(mixins)使用,必须先安装element-ui。
通过npm安装:
npm i el-table-customizer
使用方法如下:
<script>
import tableCustomTool from 'el-table-customizer'
export default {
mixins:[tableCustomTool],
}
</script>
目前支持修改
- 字体颜色
- 背景颜色
- 边框颜色
- 文本位置
- 文本粗细
- 文字大小
- 可以隐藏/显示某些列
- 本地保存修改后的列宽
说明
感兴趣的话可以下载下来试一试,不过目前版本仍然可能存在一些问题。代码写的比较丑,而且实现的方法也非常的笨拙粗暴,原谅我,现在技术还很差,但已经在努力学习了。
Git地址:https://github.com/heng4719/el-table-customizer
提供给用户使用的表格样式自定义工具,适用于elementUI表格的更多相关文章
- vue element-ui表格里时间戳转换成时间显示
工作中遇到后台给的表格数据里时间是一个13位的时间戳,需要转换成时间显示在表格里, 可以用element-ui表格自带的:formatter函数,来格式化表格内容: // 时间戳转换成时间 // 使用 ...
- Css实现checkbox及radio样式自定义
前言 checkbox和radio样式自定义在网页中是很常见的, 比如在进行表单输入时性别的选择,用户注册时选择已阅读用户协议.随着用户对产品体验要求越来越高,我们都会对checkbox和radio重 ...
- JqGrid 自定义子表格 及 自定义Json 格式数据不展示
项目第一次使用JqGrid ,发现功能强大,但由于对他不熟悉,也没有少走弯路,记录一下. 1.引用 <link href="~/Scripts/JqGrid/jqgrid/css/ui ...
- 关于element-ui表格样式设置的方法cell-class-name
关于element-ui表格使用的一些方法 最近在用Vue.js和elment-ui做一个后台管理项目,不得不说element功能非常强大,提供了许多组件,基本可以满足一些基础的开发了.因为我做的后台 ...
- delphi 设置表格样式。
//设置表格样式 wordDoc.Tables.Item(1).Borders.Item(Word.WdBorderType.wdBorderLeft).LineStyle = Word.WdLine ...
- CSS:表格样式(设置表格边框/文字/背景的样式)
使用CSS能够制作出十分精美的表格. 代码整理自w3school:http://www.w3school.com.cn 效果图: 代码: <!DOCTYPE html PUBLIC " ...
- 普通table表格样式及代码大全(全)
普通table表格样式及代码大全(全)(一) 单实线边框表格 <TABLE style="BORDER-COLLAPSE: collapse" borderColor=#00 ...
- 美丽的表格样式(使用CSS样式表控制表格样式)
按照WEB2.0风格,设计了几个表格样式,希望大家喜欢. WEB2.0提倡使用div开布局,但不是要全然放弃使用表格,表格在数据展现方面还是不错的选择. 如今使用介绍使用CSS样式表来控制.美化表格的 ...
- 漂亮的表格样式(使用CSS样式表控制表格样式)
根据WEB2.0风格,设计了几个表格样式,我希望你喜欢. WEB2.0推广使用div开放式布局.但并不是完全放弃使用形式,在数据表现形式而言是一个不错的选择. 本节将介绍如何使用现在CSS样式表来控制 ...
- Bootstrap表格样式(附源码文件)--Bootstrap
1.表格默认样式 <h4>表格默认样式</h4><table><!--默认样式--> <tr><th>序号</th> ...
随机推荐
- CF620E New Year Tree(树形+dfs序+线段树+状态压缩)
题目链接 题目大意 \(~~\)给出一棵 nn 个节点的树,根节点为 11.每个节点上有一种颜色 c\(_{i}\) 和m 次操作.操作有两种: \(~~~~\) 1. 1\(~\)u\(~\)c:将 ...
- xlwings 模块总结
基本使用 在子线程中使用时,有时需要在子线程函数中加入以下.有时不需要加入,目前还不明白具体的原因 import pythoncom # 导入的库 pythoncom.CoInitialize() # ...
- docker使用代理(in home)
docker 使用 http http_proxy https://docs.docker.com/config/daemon/systemd/ # 代理 和 国内 镜像源 不要 同时使用,... # ...
- PHP使用PHPmailer类和smtp发送邮件
开启邮件smtp服务 设置授权码 引入phpmailer类,smtp类本地下载https://github.com/PHPMailer/PHPMailer //下载PHPMailer并开启php_op ...
- Go语言核心36讲25
你好,我是郝林,今天我分享的主题是:测试的基本规则和流程(上). 你很棒,已经学完了本专栏最大的一个模块!这涉及了Go语言的所有内建数据类型,以及非常有特色的那些流程和语句. 你已经完全可以去独立编写 ...
- day19-web开发会话技术01
WEB开发会话技术01 1.会话 Web开发中,用到的4种会话跟踪技术 - 博客园 (cnblogs.com) 会话的基本介绍 什么是会话? 会话可简单理解为:用户开一个浏览器,点击多个超链接,访问服 ...
- rpm环境安装dpkg包管理工具
rpm环境安装dpkg包管理工具 索引:dpkg-scanpackages.dpkg.dpkg-query.dpkg-source.dpkg-scansource 在centos.redhat.麒麟服 ...
- 根据MediatR的Contract Messages自动生成Minimal WebApi接口
大家好,我是失业在家,正在找工作的博主Jerry.今天给大家介绍一个能大大减少ASP.Net Minimal WebApi编码量的方法. 我们一般会把微服务的VO和DTO封装成消息类,并作为WebAp ...
- 3 c++编程-提高篇-模版
重新系统学习c++语言,并将学习过程中的知识在这里抄录.总结.沉淀.同时希望对刷到的朋友有所帮助,一起加油哦! 生命就像一朵花,要拼尽全力绽放!死磕自个儿,身心愉悦! 系列文章列表: 1 c+ ...
- 【论文解读】NIPS 2021-HSWA: Hierarchical Semantic-Visual Adaption for Zero-Shot Learning.(基于层次适应的零样本学习)
作者:陈使明 华中科技大学