reactjs react-table v8如何获取自定义过滤器组件的选项值

hwamh0ep  于 2022-12-12  发布在  React
关注(0)|答案(1)|浏览(155)

我怎样才能得到preFilteredRow值作为我的自定义下拉组件中的选项。我一直在努力显示自定义组件,但现在我再次卡住了,以获得选定列的值,现在我仍然手动填充选择<option>,以下是我的实现,截至目前:
声明筛选器组件

declare module '@tanstack/table-core' {
  interface ColumnMeta<TData extends unknown, TValue> {
    filterComponent: (props: any) => any;
  }
}

列帮助器

const columns = [
  columnHelper.accessor('attributes.category.data.attributes.name', {
    cell: (info) => info.getValue(),
    header: 'Categori',
    meta: {
      filterComponent(setFilterValue) {
        return (
          <select
            name="Category"
            aria-label="Category"
            className="block w-full rounded-lg border-gray-200 text-sm shadow focus:border-green-500 focus:ring-1 focus:ring-green-500 focus:ring-opacity-75"
            onChange={(e) => setFilterValue(e.target.value)}
          >
            <option value="">All</option>
            <option value="MANUAL1">Manual Option 1</option>
            <option value="MANUAL2">Manual Option 2</option>
          </select>
        );
      },
    },
  }),
]

正如你在上面看到的,我仍然手动填充选择的<option>来匹配选择的单元格数据,它工作得很好。但是我需要从选择的单元格数据填充<option>。有人能告诉我吗?谢谢。

xmq68pz9

xmq68pz91#

我认为您可以将任何参数传递给filterComponent(setFilterValue)函数,而不是setFilterValue,例如,您可以在调用“filterComponent”的位置传递{ column,table }

相关问题