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鼠标点击列表自动改变颜色(当前列高亮效果)


基础教程推荐
猜你喜欢
- vue主页点击按钮如何调用子组件方法 2024-12-08
- 微信小程序的条件渲染应该怎么写 2024-12-13
- 用Flutter做桌上弹球(绘图(Canvas&CustomPaint)API) 2023-12-19
- JS实现把一个页面层数据传递到另一个页面的两种方式 2024-03-09
- jQuery层叠选择器用法实例分析 2024-02-08
- 详解搭建一个vue-cli的移动端H5开发模板 2023-12-20
- js登录滑动验证的实现(不滑动无法登陆) 2023-12-21
- CSS清楚浮动clear:both的实例代码 2024-02-08
- 探究background-position属性中的百分比值的使用 2023-12-11
- 解决ajax的delete、put方法接收不到参数的问题方法 2023-02-22