React Router 和 Material-Table - 过滤列值

Question

如何将 Route 参数的值传递到 React 表的过滤器字段中？

我正在使用一个名为 material-table 的组件。 得到一组这样的链接：

<ul>
  <li>
    <Link to="/Products/Dogs/Foods">Dog Food Products</Link>
  </li>
  <li>
    <Link to="/Services/Cats/Grooming">Cat Grooming Services</Link>
  </li>
</ul>

<Switch>
  <Route exact path="/:business/:category/:product" component={Material_Table}/>
</Switch>

然后在 Material_Table 组件中，我需要根据这些 url 参数过滤列。现在只需将它们放在 h4 中：

<div className="alert">
      <h4>Business: {business}. Category: {category}. Product: {product}.</h4>
    </div>

    <MaterialTable
        title = "Projects"
        icons = {tableIcons}
        columns={[
            {
                title: 'Name',
                field: 'name'
            },
            {
                title: 'Business',
                field: 'values[9]'
            },
            {
                title: 'Category',
                field: 'values[10]'
            },
            {
                title: 'Product',
                field: 'values[8]'
            },
        ]}
        data = {items}
        options ={{
          filtering: true
        }}
        />

尝试将表达式直接放在列对象中，但这不起作用。 我知道有一个默认值选项，但这似乎也不对。 非常感谢任何帮助！

Answer 1

在每列上使用defaultFilter 有效：

<MaterialTable
    title = "Projects"
    icons = {tableIcons}
    columns={[
        {
            title: 'Name',
            field: 'name'
        },
        {
            title: 'Business',
            field: 'values[9]',
            defaultFiler: business
        },
        {
            title: 'Category',
            field: 'values[10]',
            defaultFilter: category
        },
        {
            title: 'Product',
            field: 'values[8]',
            defaultFiler: product
        },
    ]}
    data = {items}
    options ={{
      filtering: true
    }}
    />