您需要使用'overflow = scroll'作为模式样式。
下面是获取可滚动material-ui modal的示例代码。在本例中，withStyles用于为modal应用样式。

• image example of material-ui scrollable
• material-ui使用withstyles

const styles = theme => ({
  modalStyle1:{
    position:'absolute',
    top:'10%',
    left:'10%',
    overflow:'scroll',
    height:'100%',
    display:'block'
  }
});
<Modal open={this.state.open4} className={this.props.classes.modalStyle1}>
  <div>
    <Button size="small" color="primary" variant="contained" onClick={this.closeOrder}>
      Close
    </Button>
    {this.getPics()}
  </div>
</Modal>

使用Dialog组件会有更好的运气。Modal是Dialog利用的一个较低级别的构造。您可以在组件演示部分找到Dialog示例。

我知道这个问题已经回答了，但我发现检查的答复不完整。
为了使一个适当的模态，你最有可能希望它有一个最大的高度，并分为3个主要部分：

• 标题
• 内容
• 页脚（可选）

如果内容（即表单）中有一个很长的元素列表，将overflow: 'scroll'设置为modal将导致两个主要问题：

• maxHeight将仅应用于容器，而其余内容仍将在下面可见
• 当用户滚动时，标题也会滚动到看不见的地方

一个只涉及标题和内容的更接近生产的示例是：

const styles = theme => ({
  modal:{
    position:'absolute',
    top:'10%',
    left:'10%',
    overflow:'hidden',
    height:'100%',
    maxHeight: 500,
    display:'block'
  },
  header: {
    padding: '12px 0',
    borderBottom: '1px solid darkgrey'
  },
  content: {
    padding: 12,
    overflow: 'scroll'
  }
});

const { classes } = this.props
<Modal open={this.state.open}>
  <div className={classes.modal}>
    <div className={classes.heading}>
      <h4>Your Title here</h4>
    </div>

    <div className={classes.content}>
      <Button size="small" color="primary" variant="contained" onClick={this.closeOrder}>
        Close
      </Button>

      {this.getPics()}
    </div>    
  </div>
</Modal>

除了格式更好之外，此解决方案还有两个主要区别，可以解决上面解释的实际问题：

• Modal有overflow: hidden，把所有东西都藏在盒子外面
• 内容有overflow: scroll，这不会暴涨的标题了，这是我们正在寻找的

希望这有帮助!

对于任何人寻找一个快速的答案，这是我找到的解决方案：

<Modal
                open={open}
                onClose={handleClose}
                aria-labelledby="simple-modal-title"
                aria-describedby="simple-modal-description"
                style={{ overflow: 'scroll' }}
              >

       <div style={
       zIndex: 10,
       position: absolute,}>
{/*your content here*/}
       </div>

</Modal>

所以只有两个简单的步骤...
1.使模式溢出可滚动

<Modal
             style={{ overflow: 'scroll' }}
           >

1.更新modal的每个直接子元素的样式。你至少需要添加这2个属性：

<div style={
zIndex: 10,
position: absolute,}>

然后，您可以使用css重新定位具有top或left属性的内容，或者根据需要自定义容器。不需要切换到对话框组件来解决此问题。

在v5文档中，您希望使用Dialog，而不是具有scroll=body|paper属性的Modal。
不要使用带有overflow:auto和封闭<div/>的模态：

<Modal open={contentOpened} style={{ overflow: "auto" }}>
  <div>
    <MyModalContent />
  </div>
</Modal>

使用清洁剂<Dialog/>

<Dialog open={contentOpened} scroll="body">
  <MyModalContent />
</Dialog>

在此处阅读有关MUI滚动内容对话框的更多信息...

使用props disableScrollLock。默认设置为“false”。所有可用的props都在这里：https://mui.com/material-ui/api/modal/

<Modal disableScrollLock={true}>
</Modal>