MUI 選擇標簽未正確隱藏

Question

我有一個 MUI Select，我想隱藏標簽，但它不起作用：

    <FormControl fullWidth>
      <Select
        value={selectedEntry}
        onChange={(e) => handleSelectEntry(e.target.value)}
        inputProps={{ 'aria-label': 'Without label' }}
      >
        {dropDownList?.map((entry) => (
          <MenuItem key={entry.key} value={entry.key}>{entry.value}</MenuItem>
        ))}
      </Select>
    </FormControl>

它顯示：輸出1

Answer 1

您可以設置Select的displayEmpty屬性，如果為 true，即使沒有選擇任何項目，也會顯示一個值。 為了顯示有意義的值，可以將一個函數傳遞給renderValue ，該renderValue返回要在未選擇任何項目時顯示的值。 但是您不能提供任何renderValue並且不會顯示“標簽”（實際上它更像是默認顯示值）。

空選：

<Select
  value={selectedEntry}
  displayEmpty
  onChange={(e) => handleSelectEntry(e.target.value)}
>

選擇默認顯示值：

<Select
  value={selectedEntry}
  displayEmpty
  onChange={(e) => handleSelectEntry(e.target.value)}
  renderValue={value => value || 'there\'s nothing selected'}
>