使用react bootstrap排序表列不起作用

Question

我正在研究使用react-bootstrap-table庫，主要是因為對列進行排序似乎很容易。 我需要堅持使用該庫中的結構嗎？

我的舊項目使用的是常規表，看起來確實很混亂。

這個庫看起來很簡單，我希望我能夠使用該庫的元素，而不是全部使用排序表功能。

我一直在這里看，但找不到任何有關使用常規表的信息

http://allenfang.github.io/react-bootstrap-table

我假設我需要使用正確的庫才能使其正常工作。 這樣的。

<BootstrapTable ref='table' data={ products }>
<TableHeaderColumn dataField='id' isKey={ true } dataSort={ true }>Product ID</TableHeaderColumn>
</BootstrapTable>

但是我做不到。

<Table ref='table' data={ products }>
<thead>
<tr>
<th dataField='id' isKey={ true } dataSort={ true }>Product ID</TableHeaderColumn></th>
</tr>
</thead>
</Table>

Answer 1

好吧，您當然不能使用像這樣的單端組件標簽。 <th></TableHeaderColumn></th>永遠不會起作用，因為沒有相應的<TableHeaderColumn> 。

因此， <TableHeaderColumn>是一個組件，而不是標簽。 你在做什么使用該組件的性能和插入他們的屬性是<th>標簽。 這行不通。 我不會說永遠不會，因為在某些情況下，有些屬性會直接轉換為標簽屬性，但總的來說-不會。

如果要使用組件庫，則在某些情況下，如果正確導出和合並了子組件，則可以使用子組件。 恐怕該庫不是這種情況。 它是為了整體運作。 標題的組件為表格主體組件的功能提供排序指令/數據。 也就是說，表主體組件使用從表頭提供的數據來確定表中數據的排序順序。

我希望這是有道理的。 簡而言之，此表庫是一個整體，而不是一部分。 我敢肯定，只要有足夠的時間，人們就可以拆散該庫並使其部分工作而不需要整個庫，但是僅僅使用整個庫並重建表可能會更容易/更快。

旁注：

在查看React-Bootstrap-Table文檔時，它首先指出它已被棄用（我之所以提及這一點，是因為未顯示您的完整代碼，並且不確定所導入的版本）。

這是不推薦使用的版本： React-Bootstrap-Table2