Динамический нижний колонтитул в React-таблице на основе отфильтрованных данных

Question

Есть ли способ обновить нижний колонтитул в React-Table на основе отфильтрованных данных? Я пытаюсь поместить нижний колонтитул, который суммирует столбец и изменяется при фильтрации данных.

*** Обновление: Я добавил ответ ниже о том, как я заставил это работать. Вы также можете просмотреть полный код моей рабочей таблицы здесь: https://github.com/travisdock/pf-frontend/blob/master/src/components/table.js

Answer 1

Для всех, кому интересно, как я это сделал, вот мой код:

Footer: columnProps => {
        return(
          <span>
            {columnProps.data.length > 0 ? this.sumEntries(columnProps.data) : 0}<br></br>
            {columnProps.data.length > 0 ? this.averageEntries(columnProps.data) : 0}
          </span>
        )
      }

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

Answer 2

Конечно, есть! Просто используйте атрибут состояния в качестве содержимого нижнего колонтитула. Теперь, если вы измените эту часть состояния, response отобразит все компоненты (снова), которые используют этот атрибут состояния. Для получения дополнительной информации, пожалуйста, прочитайте " Состояние и жизненный цикл " из документации реагирования.