el-table鼠标点击列表自动改变颜色(当前列高亮效果)

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 内容，请继续关注编程基础学习网。