修复 react-select 下拉列表的高度（React Material UI）答案

【问题标题】：Fix the height of react-select dropdown list (React Material UI)修复 react-select 下拉列表的高度（React Material UI）
【发布时间】：2019-05-02 10:22:01
【问题描述】：

我已经使用 react-select 实现了下拉菜单，使用它会显示预先输入的选项，但最初下拉列表很大并且占据了整个页面。我想知道如何将 react-select 下拉列表设置为固定高度并在溢出时提供滚动。 react-select

以下是我的部分代码

class Project extends React.Component {
  render() {
    const selectStyles = {
      input: base => ({
        ...base,
        color: theme.palette.text.primary,
        '& input': {
          font: 'inherit',
        },
      })
    };
    return ( <
      SelectN inputProps = {
        {
          name: 'headedByUserId',
          id: 'headedByUserId',
        }
      }
      classes = {
        classes
      }
      styles = {
        selectStyles
      }
      options = {
        suggestions
      }
      components = {
        components
      }
      value = {
        this.state.fields["headedByUserId"]
      }
      onChange = {
        this.handleChangeDropdown.bind(this, "headedByUserId")
      }
      placeholder = "select owner"

      /
      >
    )
  }
}

【问题讨论】：

标签： css reactjs react-material

【解决方案1】：

react-select 有一个属性

maxMenuHeight="200"

使用它我们可以设置下拉列表的高度，如果在材质对话框中下拉，您可以设置对话框属性“溢出”：“可见”以显示下拉列表

【讨论】：