javascript - 如何过滤与 react 表中给定输入完全相等的值?

标签 javascript reactjs function react-table

我在这里使用 react 表的内置 setFilter 函数。第二个参数是每个输入类别将与之匹配但不完全匹配的值。例如,如果我们有两个类别政府和非政府,我必须过滤政府。但它正在过滤政府和非政府,因为政府一词出现在非政府一词中。 我现在该怎么办?

const tableInstance = useRef(null);
  const filterTests = (criteria) => {
    if (tableInstance.current) {
      tableInstance.current.setFilter('test_category', criteria.category);
      tableInstance.current.setFilter('test_state', criteria.state);
      tableInstance.current.setFilter('test_client', criteria.client);
      tableInstance.current.setFilter('test_name', criteria.name);
    }
  };

我在另一个组件中调用 filterTests 表:

const handleFilter = () => {
    let criteria = {};
    criteria.category = category;
    criteria.state = state;
    criteria.client = client;
    criteria.name = name;
    filterTests(criteria);
  };

我的列文件的数据是:

export const columns = [
  {
    id: 'test_name',
    Header: 'NAME',
    accessor: 'name',
  },
  {
    id: 'candidate_site_blocked',

    Header: `BLOCK
CANDIDATE SITE
  REGISTERATION`,
    accessor: 'block_candidate_site_registration',
  },
  {
    id: 'admin_site_blocked',

    Header: `BLOCK
ADMIN SITE
  REGISTERATION`,
    accessor: 'block_admin_site_registration',
  },

  {
    id: 'delete_test',

    Header: '',
  },
  {
    id: 'test_category',
    accessor: 'category',
  },
  {
    id: 'test_state',
    accessor: 'state',
  },
  {
    id: 'test_client',
    accessor: 'client',
  },
];

最佳答案

在相应的列对象中试试这个:

 {
    id: 'your_column_id',
    accessor: 'your_accessor',
    filter: (rows, id, filterValue) =>
      rows.filter((row) => filterValue === '' || row.values[id] === filterType)
 }

关于javascript - 如何过滤与 react 表中给定输入完全相等的值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65407553/

相关文章:

javascript - 使用 C# 将数组注册到 JavaScript

javascript - fadeIn 仅在未显示时 fadeOut 完成

javascript - 关于 app.listen(port, hostname) 和 server.createServer() 的混淆

reactjs - React-Table 给出未捕获的语法错误 : Unexpected Identifier in propTypes. js

java - 使用对象或字符串作为参数覆盖

javascript - 验证码问题?

javascript - 从终端(iOS)运行 React Native 应用程序时出错

reactjs - 为什么在指定的值为空时 react 突出显示我的第二个 <select> 选项?

javascript - react Hook : State always setting back to initial value

php - 等同于 PHP 中的 Function.prototype.apply?