Индивидуальная стилизация фильтров в реагирующей таблице

Question

Я построил таблицу с реактивной таблицей и хочу использовать компонент реагировать-выбор в качестве компонента фильтрации.Все работает и работает, за исключением того, что выпадающий список компонентаact-select скрыт таблицей.

Я довольно долго работал над этой проблемой.Благодаря стилю ответной реакции, чтобы хорошо выглядеть в ряду фильтров.

Проблема в том, что я не могу найти какой-либо другой способ переопределить правила CSS для

.ReactTable .rt-th,.ReactTable .rt-td

, который, по-видимому, контролирует строку со всеми фильтрами.У этого css есть правило overflow:hidden;, и изменение его на overflow:visible; решает мою проблему.

Жесткое кодирование изменений в этом файле, конечно, не "правильный способ сделать это", поскольку у меня могут возникнуть проблемы в другом месте.,

Вещи, которые я пробовал:

1. Передача styles={{overflow:visible}} моему фильтрующему компоненту.В результате получается странный стиль = 'Object object', и мой стиль не читается.

2. Passing getProps:()=>{style:{overflow:'visible'}}.Пробовал другие методы, затем getProps, но безуспешно.

Любые другие идеи или предложения?

Решение

Опора getTheadFilterThProps отсутствуетв документации.Свойство было найдено путем поиска в папке реагирующей таблицы и проверки наличия пропущенных в документации реквизитов.

<ReactTable 
    getTheadFilterThProps={(state, rowInfo, column) => {
                            return {
                              style: {
                                overflow: 'visible',
                              }
                            };
                          }}

Answer 1

Хорошо, ANSWARE было довольно просто найти правильный реквизит.Я закончил поиск для getTheadFilterTrProps в папке установки реактивной таблицы.Потом я обнаружил, что есть еще несколько реквизита.

Я заканчиваю тем, что добавляю

<React
    getTheadFilterThProps={(state, rowInfo, column) => {
      return {
        style: {
          overflow: 'visible',
        }
      };
    }}