material-ui: need help overriding styling-CodePudding

I am using the Select component from material-ui. In the documentation of material-ui, it is said that you can override the CSS from the components using the tag sx={{ ... }}. I need to style the component with className of '.MuiSvgIcon-root-393', which is a SVG child of 'Select'. Here is my attempt, but is not working:

import { Select } from '@material-ui/core'

<Select
    sx={{
      '.MuiSvgIcon-root-393': {
        visibility: 'hidden'
      }
    }}
>
    ....
<Select/>

What I am really trying to do is to make the Select arrow hidden.

I would appreciate some help in how to proceed with this, and/or any tips.

CodePudding user response：

Think this will solve your problem.

github.com/mui/material-ui/issues/26473

Looks like they just remove the icon, and adjust the padding to reclaim the space it would've taken up.