reactjs 无法使用样式实用程序覆盖Mui Accordion

rm5edbpk 于 2022-12-22 发布在 React

关注(0)|答案(2)|浏览(156)

我想用Mui样式的工具覆盖 accordion 式CSS，但是我无法将 accordion 式CSS应用到它上面。在我的代码中有一个底层类，我无法指向它。这是Mui类：

<div class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation1 MuiAccordion-root MuiAccordion-rounded MuiAccordion-gutters css-1elwnq4-MuiPaper-root-MuiAccordion-root" style="user-select: auto;">

这是我的 accordion 代码

const CustomizedAccordion = styled(Accordion)<AccordionProps>(({ theme }) => ({
    root: {
        "& .MuiPaper-root": {
            color: 'darkslategray',
            backgroundColor: '#E4FAF4',
            borderRadius: '0.6rem',
            boxShadow: 'none'
        }
    
    },
    paddingBottom: '1.6rem',
    boxShadow: 'none',

}));

reactjs

来源：https://stackoverflow.com/questions/70242328/unable-to-override-mui-accordion-using-styled-utility

2条答案

按热度按时间

q43xntqr1#

const CustomizedAccordion = styled(Accordion)(() => ({
  '& .MuiPaper-root': {
    color: 'darkslategray',
    backgroundColor: '#E4FAF4',
    borderRadius: '0.6rem',
    boxShadow: 'none'
  },
  paddingBottom: '1.6rem',
  boxShadow: 'none'
}));

赞(0）回复(0）举报 2022-12-22

t98cgbkg2#

我想把扩展样式从代码为.css-kj1tus-MuiPaper-root-MuiAccordion-root.Mui-expanded { margin: 16px 0; }的样式修改为margin:0px 0px 0px 4px;
但是，无法使它工作。

赞(0）回复(0）举报 2022-12-22