@n3/react-fixedtable
    TypeScript icon, indicating that this package has built-in type declarations

    0.3.7 • Public • Published

    @n3/react-fixedtable

    Таблица с фиксированными заголовками и колонками.

    Установка

    npm install @n3/react-fixedtable --save
    yarn add @n3/react-fixedtable
    

    Использование

    Нужно обернуть компонент таблицы компонентом FixedTable. ref из render props должен указывать на dom-элемент таблицы.

    import FixedTable from '@n3/react-fixedtable';
    
    ...
    
    <FixedTable>
      {({
        ref,
      }) => (
        <table
          ref={ref}
        >
          ...
        </table>
      )}
    </FixedTable>
    

    Props

    Название Обязательность Тип Значение по умолчанию Описание
    className string '' Класс корневого элемента
    stickyHeadClassName string '' Класс шапки в зафиксированном состоянии
    stickyFootClassName string '' Класс футера в зафиксированном состоянии
    children + func Функция рендера таблицы
    @param {Object} renderProps
    @param {React ref} renderProps.ref - ref таблицы
    @param {?Number} renderProps.leftCols - количество колонок таблицы, используется для оптимизации рендера таблицы с фиксированными колонками слева. Если рендерится основная таблица, принимает null
    top number 0 Отступ от верхнего края экрана до фиксированной шапки
    bottom number 0 Отсутп от нижнего края экрана до фиксированного футера
    fixedLeftCols number 0 Количество левых колонок для фиксации
    fixedLeftColsClassName string '' Класс обёртки блока фиксированных колонок
    fixedLeftColsStickyClassName string '' Класс обёртки блока фиксированных колонок в зафиксированном состоянии
    getScrollableWrapper func () => document Функция получения элемента, скролл которого отслеживается таблицей
    checkCanInit func () => true Функция проверки возможности инициализации. Если определена, инициализация не начнётся до того момента, пока не вернёт true
    checkCanInitInterval number 5 Интервал между вызовами checkCanInit в мс
    initDelay number 0 Задержка инициализации в мс
    horizontalScrollDelta number 5 Контрольное значение разницы ширины таблицы и ширины области в пикселях, начиная с которой появляется горизонтальный скролл
    scrollbarWidth number 15 Ширина скроллбара
    updateUniqs arrayOf [
      any
    ]
    [] Набор значений, при изменении хотя бы одного будет произведена перерисовка фиксированных элементов
    tableRef Ref ref для получения таблицы

    Install

    npm i @n3/react-fixedtable

    DownloadsWeekly Downloads

    30

    Version

    0.3.7

    License

    MIT

    Unpacked Size

    108 kB

    Total Files

    39

    Last publish

    Collaborators

    • a_sannikov
    • k.kulik
    • n3admin
    • v.voloshin
    • vtaits