0.2.0 • Published 3 years ago
@n3/react-table v0.2.0
@n3/react-table
Компоненты для создания таблиц для приложений на базе @n3/kit
.
import {
Table,
Th,
Td,
} from '@n3/react-table';
...
<Table>
<thead>
<tr>
<Th rowSpan={2}>#</Th>
<Th colSpan={2}>Name of person</Th>
<Th rowSpan={2}>Username</Th>
</tr>
<tr>
<Th>First Name</Th>
<Th>Last Name</Th>
</tr>
</thead>
<tbody>
<tr>
<Td>1</Td>
<Td>Mark</Td>
<Td>Otto</Td>
<Td>@mdo</Td>
</tr>
<tr>
<Td>2</Td>
<Td>Jacob</Td>
<Td>Thornton</Td>
<Td>@fat</Td>
</tr>
<tr>
<Td>3</Td>
<Td colSpan="2">Larry the Bird</Td>
<Td>@twitter</Td>
</tr>
</tbody>
<tfoot>
<tr>
<Td>#</Td>
<Td>First Name</Td>
<Td>Last Name</Td>
<Td>Username</Td>
</tr>
</tfoot>
</Table>
Props
Table
Название | Обязательность | Тип | Значение по умолчанию | Описание |
---|---|---|---|---|
lightenRow | number | null | Номер строки, для которой применена подсветка |
Th/Td
Название | Обязательность | Тип | Значение по умолчанию | Описание |
---|---|---|---|---|
className | string | '' | ||
isMinWidth | bool | false | Добавить width: 1px для рендера узких колонок (иконкий действий и т.п.) | |
isNowrap | bool | false | Добавить white-space: nowrap | |
hasWordBreak | bool | false | Добавить свойства для разбиения строк в случае переполнения | |
textAlign | enum- 'left'- 'right'- 'center' | 'left' | ||
width | union- string- number | null |