У меня есть таблица с прокручивающимися строками, но я не могу исправить заголовок.
Есть ли свойство для этого, поскольку fixedHeader был в материале 0.15 и выше, но, похоже, в версии 1.0.0 нет чего-то подобного?
Сегодня я столкнулся с той же проблемой. В версии 0.15 была поддержка fixedHeader
, а в версии 1.x ее нет. Я предполагаю, что есть планы по его внедрению.
Та же проблема с Material-ui v1.0.0-beta.16
.
Было бы очень здорово вернуть эту функцию!
Та же проблема с Material-ui v1.0.0-beta.33
Это обязательная функция! Я думаю, что любой, кто работает с сетками данных, согласится со мной.
@mariorubinas Если эта функция важна для вас, подумайте о том, чтобы отправить PR. Вы можете использовать этот вопрос, если хотите обсудить свой подход.
Это обязательная функция!! функция отлично работала в старой версии MUI.
@asrane С нетерпением жду вашего запроса на включение.
Эй , @mbrookes, я достаточно использую фиксированный заголовок и, как и все остальное в 1.0, достаточно, чтобы попробовать это — есть ли у вас / организации Material-UI предпочтительный способ исправления заголовков таблиц? Старый fixedHeader
был великолепен, но я не был большим поклонником того, как он сделал все столбцы одинаковой ширины ( table-layout: fixed;
), поэтому я собирался попытаться повторно реализовать его для поддержки динамическая ширина столбца.
@tambling Было бы здорово! поддержка динамической ширины столбцов была бы идеальной.
Следует отметить, что заголовок может быть липким:
// ...
head: {
backgroundColor: "#fff",
position: "sticky",
top: 0
}
// ...
<TableHead>
<TableRow>
<TableCell className={classes.head}>
// ...
@oliviertassinari Спасибо, это работает.
@oliviertassinari Кнопки в ячейке таблицы перекрывают заголовок таблицы. Как это решить?
https://codesandbox.io/s/qx24l9vrz6
@pranayyelugam Вам нужно будет настроить zIndex для ваших кнопок.
@mbrookes Каким должно быть значение zIndex, чтобы кнопки отображались и работали правильно?
Вот демо
https://codesandbox.io/s/qx24l9vrz6
@pranayyelugam , вы можете легко установить z-индекс на липком заголовке, и он будет иметь ожидаемый результат.
head: {
backgroundColor: "#fff",
position: "sticky",
top: 0,
zIndex: 10,
}
Для целей сравнительного анализа: https://vuematerial.io/components/table.
@oliviertassinari , это не будет работать в IE 11, верно? Технически Material UI поддерживает IE 11. Есть ли решение, которое будет работать с IE 11?
У кого-нибудь есть решение для исправления заголовка таблицы внутри компонента <Dialog>
? position: sticky
не работает.
Кажется, не работает в Chrome
У меня есть фиксированный заголовок в этом компоненте: https://github.com/SurLaTable/slt-ui/blob/develop/src/ComparisonChart/ComparisonTable/ComparisonTable.js
Интерфейс материала 3.xx!
Все еще нет фиксированного заголовка? ИМО его важная особенность ..)
Удар!
Любая идея об этом? Я использую таблицу материалов, но не могу исправить заголовок, когда появляется прокрутка.
Просто используйте две таблицы, как в моем примере, @mhidalgop.
Просто используйте две таблицы, как в моем примере, @mhidalgop.
Извините, но мне это не подходит :(
Извините, но мне это не подходит :(
@mhidalgop , не могли бы вы поделиться своим примером в чем-то вроде CodeSandbox?
Наконец, я решил свою проблему, используя это решение:
head: {
backgroundColor: "#fff",
position: "sticky",
top: 0,
zIndex: 10,
}
Спасибо!
:)
Следует отметить, что заголовок может быть липким:
// ... head: { backgroundColor: "#fff", position: "sticky", top: 0 } // ... <TableHead> <TableRow> <TableCell className={classes.head}> // ...
Это нормально работает в настольном браузере, однако в мобильных браузерах это не работает.
Следует отметить, что заголовок может быть липким:
// ... head: { backgroundColor: "#fff", position: "sticky", top: 0 } // ... <TableHead> <TableRow> <TableCell className={classes.head}> // ...
Это нормально работает в настольном браузере, однако в мобильных браузерах это не работает.
Я использую это решение в веб-приложении, и на планшете с Chrome оно работает нормально.
липкий не работает для меня, так что любое другое решение, как исправить заголовок таблицы?
+1
У меня сработало при применении этого стиля к <TableContainer>
height: 100%;
overflow-y: auto;
Самый полезный комментарий
Следует отметить, что заголовок может быть липким:
https://codesandbox.io/s/k0vwm7xpl3