我正在使用MUI樹，我想取消MuiTreeItem-group第二層的左邊空白

我試過用makeStyles來解決，但是好像不行

const useStyles = makeStyles(() => ({
  root: {
    ".MuiCollapse-root .MuiCollapse-vertical .MuiTreeItem-group": {
      marginLeft: '0px',
    },
  }
}))

然后我嘗試用@global來修改，但是會導(dǎo)致其他層一起修改

const useStyles = makeStyles(() => ({
  root: {
   
    "@global": {
      ".MuiTreeItem-group": {
        marginLeft: '0px'
      }
    }
  }
}))

我希望的效果是只能修改第二層

您可以移除。MuiTreeItem-通過使用CSS子組合子直接指向第二級來分組左邊距。例如:

const useStyles = makeStyles(() => ({
  root: {
    "& > .MuiTreeItem-root > .MuiTreeItem-group": {
      marginLeft: "0px"
    }
  }
}));

這將產(chǎn)生以下效果:

工作代碼沙盒:https://codesandbox.io/s/material-demo-forked-rhn5xf?文件=/demo.tsx:307-445