我怎样才能得到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>
。有人能告诉我吗?谢谢。
1条答案
按热度按时间xmq68pz91#
我认为您可以将任何参数传递给filterComponent(setFilterValue)函数,而不是setFilterValue,例如,您可以在调用“filterComponent”的位置传递{ column,table }