#javascript #reactjs #material-ui
Вопрос:
Привет, теперь я использую таблицу материалов в react.
здесь: https://material-table.com/#/docs/features/styling, мы можем использовать cellStyle, headerStyle , но что, если я хочу определить больше деталей, таких как стили <tr> <td> ячейки, добавить <label> в содержимое ячейки, как мы можем это сделать?
Ответ №1:
<tr> является строкой таблицы, поэтому вы можете использовать options.rowStyle.
<td> является ячейкой таблицы, поэтому вы можете использовать column.CellStyle.
Если вам нужны определенные стили для некоторых ячеек, вы можете передать элементы React или html в data :
data={[
{ name: <div><h1>Baran</h1>aaa</div> },
{ name: <MyStyledCellWithMultipleElements name="Joe" /> }
]}
Комментарии:
1. как насчет текста? например, добавьте <метку><метку></метку> в содержимое ячейки?
2. Я обновил ответ, дайте мне знать, если это то, что вам нужно
3. итак, вы имеете в виду, что если я хочу применить стили к <td>, мне нужно задать определение столбцов, даже если стиль <td><td> должен применяться к каждой ячейке? и точно так же мне нужно поместить <h1> в каждое поле данных, если я хочу иметь <h1><h1> для всех полей?
4. Вы можете создать отдельный компонент с нужным стилем и передать его в каждое поле данных. Если ваши данные поступают из серверной части в виде строки, вы можете создать
.mapи изменить нужную строку на стилизованный компонент, который получает эту строку. Это на тот случай, если вам нужно переместить элементы в ячейку.