Пример react-table globalFilter для NumberRangeColumnFilter

Пытаясь реализовать NumberRangeColumnFilterза пределами таблицы в определенном столбце. В основном с помощью globalFilter.

Я преобразовал SelectColumnFilter от примера до глобального фильтра выбора за пределами таблицы, как показано ниже.

function GlobalSelectFilter({
    preGlobalFilteredRows,
    globalFilter,
    setGlobalFilter,
}) {
    const [value] = React.useState(globalFilter)
    const options = React.useMemo(() => {
        const options = new Set()
        preGlobalFilteredRows.forEach(row => {
            options.add(row.values['priority'])
        })
        return [...options.values()]
    }, ['priority', preGlobalFilteredRows])

    return (
        <span>
            <select
                value={value}
                onChange={e => {
                    setGlobalFilter((e.target.value == 'All' ? undefined : e.target.value) || undefined)
                }}
            >
                <option value="">All</option>
                {options.map((option: any, i) => (
                    <option key={i} value={option}>
                        {option}
                    </option>
                ))}
            </select>
        </span>
    )
}

Но когда я пытаюсь использовать NumberRangeColumnFilter пример для Global NumberRangeColumnFilter, то globalFilter не принимает массив вроде filterValue = []

Мой подход совершенно неверен? Как достичь этого минимального максимального диапазона для globalFiltering. Пример действительно поможет. Также пытаюсь сделать это с помощью фильтрации по диапазону дат.

0 ответов

Другие вопросы по тегам