javascript - 材质 UI：选择已折叠，自动宽度不起作用

Question

Material UI (React) Select 项目已折叠并且不会自动扩展宽度，尽管autoWidth.

   <FormControl margin="dense">
          <InputLabel id="prefix-label">Prefix</InputLabel>
          <Select
           autoWidth
           labelId="prefix-label"
           id="prefix"
           disabled={formPrefix.disabled}
           value={formPrefix.value ?? ""}
           error={formPrefix.invalid}
           defaultValue={""}
           label="Prefix"
           onChange={handlePrefix}
          >
                 <MenuItem value={""} disabled>
                        Prefix
                 </MenuItem>
                 <MenuItem value={"US"}>US +1</MenuItem>
                 <MenuItem value={"else"}>Else</MenuItem>
          </Select>
          <FormHelperText></FormHelperText>
   </FormControl>

我在这里做错了吗？

标签： javascriptreactjsmaterial-uiemotion

Answer 1

您应该将width属性添加到类似的sx道具FormLabel：

<FormControl margin="dense" sx={{ width: 100 }}>

您可以查看此沙箱以获取实时工作示例。