Material-UI TreeView height

Question

Does anyone know how to set material-ui TreeView fixed height or height fitted to display?

I want scrollbar to be shown when TreeView content height become 100 for example or 100% of display height. Now when I expand my tree all content that didn't fit, goes away of the display bottom.

Answer 1

Just modify the root style of TreeView component. Add your desirable height to the height attribute and then assing overflow to auto to make the whole TreeView component scrollable. Sandbox

const useStyles = makeStyles({
  root: {
    height: "50px",
    flexGrow: 1,
    maxWidth: 400,
    overflow: "auto"
  }
});
<TreeView
      className={classes.root}
      defaultCollapseIcon={<ExpandMoreIcon />}
      defaultExpandIcon={<ChevronRightIcon />}
    >