首页 > 解决方案 > 如何更改react-table中单行的边框颜色

问题描述

我知道如何更改ReactTable对象中一行的背景颜色(下面的代码)。

如何更改行边框的颜色(不是整个表格的边框)?我尝试将background以下代码中的代码替换为border-color, or borderColor, or border,但这些选项都不起作用 - 要么,我得到一个错误,要么在编译时根本没有发生任何事情。

getTrProps={(state, rowInfo, column) => {
    if(rowInfo) {
        return {
            style: {
                background: "blue"
            }
        };
    }
    return {}; 
}

标签: javascriptcssreactjsreact-bootstrapreact-table

解决方案


像这样:

getTrProps = (state, rowInfo, instance) => {
    if (rowInfo) {
      return {
        style: {
          border: rowInfo
            ? rowInfo.row.age >= 20
              ? "solid 1px black"
              : "none"
            : "none"
        }
      };
    }
    return {};
  };

工作示例: https ://codesandbox.io/s/react-table-gettrprops-ijgzy


推荐阅读