vue2+element ui 中的el-table 选中当前行当前行变色

javascript 复制代码
 <el-table class="eltable" ref="multipleTable" :data="tableData" style="margin-top: 50px;width: 100%;"
                    :row-class-name="tableRowClassName" @row-click="rowClick">
                    <el-table-column v-for="(item, index) in tableTitleList" :label="item.name" :key="index"
                        :prop="item.prop" :width="item.width" align="center">
                    </el-table-column>
                </el-table>

方法:

javascript 复制代码
   rowClick(row, column, event) {
            
            console.log(row,column);
            this.selectIndex = row.index;
        },
        // 行选中样式
        tableRowClassName({
            row,
            rowIndex
        }) {
            row.index = rowIndex 
            if (rowIndex == this.selectIndex) {
                return 'success-row';
            }
        },

样式:

javascript 复制代码
::v-deep .success-row {
    background-color: #81D3F8 !important;
}
相关推荐
IT_陈寒1 分钟前
JavaScript性能优化:7个V8引擎内部原理帮你减少90%内存泄漏的实战技巧
前端·人工智能·后端
咸鱼加辣3 分钟前
【前端框架】路由配置
javascript·vue.js·前端框架
咸鱼加辣4 分钟前
【前端框架】一段普通的 JavaScript 程序
开发语言·javascript·前端框架
雪域迷影7 分钟前
怎么将.ts文件转换成.js文件?
javascript·typescript·npm·tsc
narukeu11 分钟前
聊下 rewriteRelativeImportExtensions 这个 TypeScript 配置项
前端·javascript·typescript
开压路机11 分钟前
模拟实现反向迭代器
前端·c++
San30.13 分钟前
从 0 到 1 打造 AI 冰球运动员:Coze 工作流与 Vue3 的深度实战
前端·vue.js·人工智能
xiangzhihong817 分钟前
Visual Studio 2026 正式发布,带来 AI 原生 IDE 和提升性能
前端
安_18 分钟前
为什么 Vue 要用 npm run dev 启动
前端·vue.js·npm
LYFlied18 分钟前
【每日算法】LeetCode 437. 路径总和 III
前端·算法·leetcode·面试·职场和发展