React Table v7如何向table标签注入自定义属性？

有两种简单方式能实现你要的效果：

方式一：直接在组件上追加属性 #

直接在<table>标签里添加自定义属性即可，对象展开运算符会自动合并默认属性与自定义属性：

<table {...getTableProps()} hello="world" prop2="value2">
    <thead>
        ...
    </thead>

    <tbody {...getTableBodyProps()}>
        ...
    </tbody>
</table>

最终渲染结果为：

<table role="table" hello="world" prop2="value2">

方式二：封装自定义属性获取函数 #

如果需要在多处复用这些自定义属性，可以包装原有的getTableProps()函数，合并默认属性与自定义属性后返回：

// 封装自定义函数
const getCustomTableProps = () => {
  const defaultProps = getTableProps();
  return {
    ...defaultProps,
    hello: "world",
    prop2: "value2"
  };
};

// 使用自定义函数
<table {...getCustomTableProps()}>
    <thead>
        ...
    </thead>

    <tbody {...getTableBodyProps()}>
        ...
    </tbody>
</table>

内容的提问来源于stack exchange，提问作者joedotnot