javascript - 如何使用react js过滤html表的所有列？

Question

我正在创建自定义数据表。我添加了排序、分页但无法在所有列上进行搜索。这是我创建的内容的 URL

https://codesandbox.io/s/yv48o7onwj

数据数组包含大写单词和整数。

如何使用单个输入框对所有列进行过滤/搜索？

Answer 1

您可以使用 Array.filter 来做到这一点

const filtered = products.filter(item => (
   item.id === searchString ||
   item.name === searchString ||
   item.price === searchString ||
   item.qa === searchString ||
   item.qr === searchString ||
   item.vendor === searchString
));

然后将第 326 行的 {products.map(item => { 替换为 {filtered.map(item => {