如何在sx属性中合并多个选择器并赋予相同样式属性？

你可以在MUI的sx属性中通过逗号分隔多个选择器来实现给它们设置相同样式的需求，这和原生CSS的多选择器语法逻辑一致。

你之前用空格分隔两个选择器的写法.MuiAutocomplete-popupIndicator .MuiAutocomplete-popupIndicatorOpen是后代选择器逻辑，会匹配.MuiAutocomplete-popupIndicator内部的.MuiAutocomplete-popupIndicatorOpen元素，而非同时选中这两个独立的类，所以达不到预期效果。

修改后的代码如下：

<Autocomplete
  disablePortal
  options={[1, 2, 3]}
  sx={{
    width: 1,
    // 用逗号分隔两个选择器，统一设置样式
    '.MuiAutocomplete-popupIndicator, .MuiAutocomplete-popupIndicatorOpen': {
      bgcolor: 'transparent',
      mr: 2,
    },
  }}
  renderInput={params => <TextField {...params} />}
/>

这样就能一次性给两个选择器赋予相同的样式属性，避免重复代码。

内容的提问来源于stack exchange，提问作者newProgrammer.cpp