ant-design-vue中根据行属性设置table某一行的样式

首先展示下最终的实现效果：

需求是将项目编号值为空的行区别与其他数据展示

需要使用到antdesign中的rowClassName属性

第一步:需要在a-table组件上添加rowClassName属性

<a-table:columns="yhxxcolumns":locale="locale":data-source="yhxxdata"borderedid="yhgltable"size="middle":rowClassName="setRowNewStyle"></a-table>

第二步：在methods中定义setRowNewStyle方法，使其根据每一行的项目编号属性值是否为空展示不同的颜色

setRowNewStyle(record){if(record.XMBH){return}else{return 'newRowStyle'}},

第三步：在css文件中定义这个样式

.newRowStyle {font-weight: bold;color: red;background-color: orange;}

至此效果就可以实现啦，大家可以根据需要更改css的样式设置。