el-table点击行实现高亮效果,highlight-current-row
就可以实现这个功能,在改一下css样式。
<el-table
:data="listData"
border
v-loading="dataLoading"
:header-cell-style="{
background: '#00C0EF',
color: '#fff',
}"
:cell-style="{
padding: '2px 0',
fontSize: '12px'
}"
highlight-current-row
>
参数说明:
data:数据
border:边线
v-loading:加载效果
header-cell-style:th样式
cell-style:td样式
highlight-current-row:高亮效果
css样式
.el-table__body tr.current-row > td {
background-color: #00c0ef !important;
color: #fff;
}
以上是编程学习网小编为您介绍的“el-table鼠标点击列表自动改变颜色(当前列高亮效果)”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:el-table鼠标点击列表自动改变颜色(当前列高亮效果)


猜你喜欢
- 学习JavaScript图片预加载模块 2024-02-25
- 使用js获取地址栏中传递的值 2023-12-26
- 一些常用的JavaScript函数(json)附详细说明 2024-01-15
- CSS使用自定义光标样式的实现_遁地龙卷风 2024-01-06
- vue+element使用sortable拖拽实现行排序 2023-10-08
- javascript中关于执行环境的杂谈 2023-12-01
- 微信小程序输入多行文本的实战记录 2024-02-20
- sql语句:删除数据库中重复的数据只保留一条 2024-12-08
- v-for循环绑定el-color-picker颜色选择器绑定value/v-model值 2024-12-08
- 微信小程序自定义用户登录弹窗 2023-12-25