如何合并反应表中的单元格

Question

我正在使用react-table，并希望根据内部单元格的数量合并特定单元格的单元格。它喜欢删除分隔边框。

它看起来像这样： https: //i.stack.imgur.com/2sJ9O.png

我尝试Columns使用border-bottom: 1px solid transparent !important;and来使用 className border-top: 1px solid transparent !important;，但它不起作用。你能告诉我该怎么做吗？感谢您。

Answer 1

在 useTable 中使用 defaultColumn，然后可以传递 cell : customTableCell 例如：

const defaultColumn = useMemo( () => ({ 
Filter: DefaultColumnFilter, 
Cell: customTableCell || TableCell, 
Header: DefaultHeader, }), [] ); 

const instance = useTable( {
 columns, data: data || [zeroStateData], 
defaultColumn, }, );