The second clear button shows only on Chromium; it doesn't show on Firefox.

第二个Clear按钮只在Chromium上显示，在Firefox上不显示。

Example of a MUI React Autocomplete component showing two clear buttons.

显示两个明确按钮的MUI Reaction AutoComplete组件的示例。

All the solutions mentioned here hide only the right most button, not the one on the left.

这里提到的所有解决方案只隐藏了最右边的按钮，而不是左边的按钮。

How do I hide the one on the left?

我怎么把左边的那个藏起来？

This seems to happen only when type: 'search' is added to InputProps

似乎只有在InputProps中添加了type：‘Search’时才会出现这种情况

Minimal, reproducible example on Chromium Version 110.0.5481.100:

Chromium版本110.0.5481.100上的最小、可重现的示例：

<Autocomplete
  disablePortal
  disableClearable
  id="combo-box-demo"
  options={supported_games}
  sx={{ width: 300 }}
  renderInput={(params) => <TextField {...params} label="Movie" InputProps={{ ...params.InputProps, type: 'search'}} />}
/>

Should be the default style from input type="search", add this to your TextField sx props:

应该是来自INPUT TYPE=“Search”的默认样式，将此添加到您的Textfield SX道具中：

sx={{ "input[type='search']::-webkit-search-cancel-button": {
     display: "none",        
   }
}}