MUI 更改選擇標簽的 css 和所選選項的顏色

Question

幾天來，我正在努力使用MUI組件，在 React 應用程序中構建頁面。

我快完成了，只缺少兩件事......

我在我的頁面中使用了選擇和自動完成。 在他們兩個中，我都將{shrink=false}設置為輸入標簽，但我不知道如何應用display:none一旦選擇了一個選項（就像而不是縮小只是消失 - 現在它們彼此重疊 -我不知道為什么當shrink 設置為false 時，默認情況下它不是這樣的......）。

此外，在選擇組件中，當它在輸入文本中時，我需要所選選項的顏色為白色（而不是標簽 - 現在，連同它...... - 現在它是黑​​色）。

有誰能幫助我嗎？ 或者至少給我指明了一個可以看的方向？

我正在閱讀文檔，但我無法想出辦法。 調用 handleChange 方法時我應該做些什么嗎？ - 那是那個時刻……但是，如何改變他們的風格？

感謝任何可以幫助xxx的人

Answer 1

我使用狀態解決了它：

const [selected, setSelected] = useState(false);

在<Select>組件中：

onChange={(event) => {
  setSelected(true);
  handleChange(event);
}}

然后我將輸入標簽值設置為字符串或所選選項：

<InputLabel
  ref={inputLabel}
  className={classes.inputLabel}
  id="simple-select-label"
  shrink={false}
>
  {selected ? '' : 'Itinerario'}
</InputLabel>

希望能幫助某人。 X