下拉选择材质ui的位置

Question

我正在使用从材质 UI 中选择，但我在下拉菜单中遇到的问题不在一个位置。

我想要它：

它在我的显示方式：

打开下拉菜单时

所以基本上下拉菜单显示在其字段的中心，而不是显示在其下方。我进行了研究，发现它是默认设置（下拉列表位于其字段下方）但在我的情况下没有发生。

下拉菜单代码

 <div className="row-5" style={{ marginTop: "21px" }}>
                            <div className="repeat">

                                <FormControl variant="standard" sx={{ m: 1, minWidth: 120 }}>
                                    <InputLabel id="repeat-id">Repeat</InputLabel>
                                    <Select
                                        style={{ width: '420px' }}
                                        labelId="repeat-id"
                                        id="demo-simple-select-standard"
                                        // value={age}
                                        // onChange={handleChange}
                                        label="Repeat"
                                        defaultValue="Never"
                                    >
                                        <MenuItem value="Never">
                                            Never
                                        </MenuItem>
                                        <MenuItem value={10}>Ten</MenuItem>
                                        <MenuItem value={20}>Twenty</MenuItem>
                                        <MenuItem value={30}>Thirty</MenuItem>
                                    </Select>
                                </FormControl>

                            </div>
                        </div>

Answer 1

您必须从这里导入 Select 组件：

    import FormControl from '@mui/material/FormControl';
    import Select from '@mui/material/Select';

这对我很有效。