《JeecgBoot系列》JeecgBoot(ant-design-vue) 识别字段中指定内容并修改该行文字颜色

JeecgBoot(ant-design-vue) 识别字段中指定内容并修改该行文字颜色

需求：将生产工厂是配件工厂的行改变颜色标注

一、修改table组件内容

在内添加:rowClassName="tableRowClass"

    ...
	:rowClassName="tableRowClass"
    ...

二、修改methods方法

在methods方法中添加tableRowClass方法，主要用于逻辑处理，判断该行是否需要改变颜色。其中factory是字段名称，如果是需要修改的行，则返回rowClass。

tableRowClass(record){
    if(record.factory == '配件工厂'){
        return "rowClass";
    }else {
        return "";
    }
}

三、CSS添加rowClass

注意：rowClass不要写在里

<style>
  .rowClass {
    color: blue;
  }
style>

以上步骤都处理完后再运行就可以看到颜色已经改变：