如何删除 Material-UI 中扩展面板的边框？

Question

如何删除 Material-UI 中扩展面板区域的边框？

Answer 1

您应该能够将标高设置为 0，这将删除盒子阴影：

<Accordion elevation={0}>

（注：ExpansionPanel 已重命名为 Accordion）

Answer 2

This works for version "@material-ui/core": "4.9.9"

You can use the following to be applied for the entire theme:

const theme = createMuiTheme({
  overrides: {
    MuiExpansionPanel: {
      root: {
        '&:before': {
          display: 'none'
        },
      },
    },
  }
}

Or if you need it only for one component then can be hidden through a class style:

import { makeStyles } from '@material-ui/core/styles'

....
const useStyles = makeStyles({
  hideBorder: {
    '&.MuiExpansionPanel-root:before': {
      display: 'none',
    },
  },
})

....
const classes = useStyles()

.....
<ExpansionPanel className={classes.hideBorder}>

Answer 3

尝试编辑类的css expansion-panel（我猜你的意思是盒子阴影，没有边框）

.expansion-panel {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}