Javascript 反应下拉列表不'；t在固定div中打开选项

这些是我用来创建下拉列表的导入

 import TextField from '@material-ui/core/TextField';
 import Autocomplete from '@material-ui/lab/Autocomplete';

css

资料

如果我不使用fixed div，则会正确打开所有选项的下拉列表。但是我需要这个固定的班级。我既不能理解这个问题，也找不到任何解决办法

 return (
  <div className="fixed">
  <Autocomplete
  options={options}
  style={{ width: 300 }}
  renderInput={(params) =>
    <TextField {...params} label="Combo box" variant="outlined"  />}
/>
</div>
)

返回(
}
/>
)

当位置固定时，尝试提供更多的宽度和高度并检查。它可能隐藏在背景中，我应该添加下拉列表的高度和宽度吗？已尝试。不工作@Mahesh为固定位置div设置一些宽度和高度，并检查它，然后查看。它是如何在后台渲染的

const  options = [ "Baseball", "Basketball", "Cricket", "Field Hockey", "Football", "Table 
 Tennis", "Tennis", "Volleyball" ];

 return (
  <div className="fixed">
  <Autocomplete
  options={options}
  style={{ width: 300 }}
  renderInput={(params) =>
    <TextField {...params} label="Combo box" variant="outlined"  />}
/>
</div>
)