Блог

Я пытаюсь создать конкретную таблицу в react, используя material UI.

По сути, в самой таблице нет строк, разделяющих строки, за исключением строки между заголовком таблицы и телом таблицы. Из того, что я нашел, я попытался удалить нижнюю границу из ячейки таблицы с помощью переопределений в теме, но я не знаю, как применить их обратно только к определенным табличным ячейкам в заголовке таблицы. Вот переопределение в моей теме:

 overrides: {
    MuiTableCell: {
      root: {
        borderBottom: 'none'
      }
    },
 

Другой подход, который я мог бы попробовать, — применить стиль через параметр Style в каждой табличной ячейке. Какой способ был бы наиболее эффективным?

Вы можете переопределить темы MUI с помощью useStyles . Смотрите Документацию

в вашем случае, скажем

 import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import { TableCell } from '@material-ui/core';

const useStyles = makeStyles({
  specificCell: {
    borderBottom: 'none';
  },
});



export default function Sample() {
  const classes = useStyles();
  return (
      ...
      ...
      <TableCell className={classes.specificCell}> </TableCell>

  );
}