一文带你学会ant design vue利用rowClassName给table添加行样式

前端领域优质创作者

2022-12-25 22:51:29

主要内容：利用rowClassName给table添加行样式
实际例子：修改table表格的颜色
解决方法：rowClassName+ pointer-events: none;

vue3 antd table表格——自定义单元格样式（二）利用rowClassName给table添加行样式

...全文

49 回复打赏收藏转发到动态举报

写回复

回复

切换为时间正序

请发表友善的回复…

发表回复

相关推荐

ant design vue利用rowClassName给table添加行样式目录1. 需求：表格每行数据hasVerdict值不为'1'时标红显示2. 实现方式：table属性rowClassName3. 问题：样式未生效4. 解决方案4.1 方案一：删除scoped4.2 方案二：样式穿透5. 总结目录 1. 需求：表格每行数据hasVerdict值不为’1’时标红显示 2. 实现方式：table属性rowClassName html部分代码 <a-table ref="table"

利用ant design vue组件库内置的API属性（rowClassName）给table表格添加行样式。利用css的不可控操作，去除表格的斑马纹样式。

Ant Design Vue使用rowClassName实现行样式根据变量变化而变化

写在前面：需求：高亮“客户名称”是“晓明”的数据行实现：用到 ant design vue table 的api：rowClassName vue文件相关代码 <script> methods() { rowClassName(record,index) { return record.custName == '晓明'? 'row-background':'' } } </script> <style scoped> /deep/.row-

如图：当我表格名字为汇总时添加背景颜色代码如下： <a-table :scroll="{ y: 1000 }" :columns="columns" :data-source="ii" :pagination="false" :rowClassName="tableRowClass" > ... 添加方法tableRowClass tableRowClass(record, index) { if (record.name == '汇.

63,556

社区成员

14,507

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

QQ群：480072171

英雄算法交流 8 群