Николай Ланец
22 июня 2019 г., 15:51

Table

Всем привет!

Сегодня добавил новый компонент - Table, а к нему еще TableRow и TableCell. Не сложно догадаться, что это для создания таблиц. Но есть момент: таблицы могут быть не только статическими (с набитыми вручную строками/колонками), но и динамическими - для вывода данных из ListView.То есть можно сформировать выборку данных по API и вывести их в таблицу. Вот для примера быстренько накидал страницу вывода команд: https://prisma-cms.com/teams/, можете изучить структуру. Чтобы проще было, записал видео:


Вообще задачка оказалась немного нетривиальной, потому что тегу tr нельзя задать бордер, а они нужны для того, чтобы в визуальном редакторе было видно имеющиеся строки, выделить, удалить и т.п. Пришлось клепать обертки с дисплей flex. В общем, в визуальном редакторе, все колонки будут иметь одинаковую пропорциональную ширину, даже если вы четко укажите другую ширину. Но в обычном выводе эти обертки отсутствуют, а выводится четкая структура table-tbody-tr-td, так что там уже ваши дополнительные атрибуты установленные будут учитываться как положено.

Добавить комментарий