Материал-пользовательский слайдер, как я могу использовать активированный (CSS API), чтобы скрыть тени

Question

я хочу узнать, как использовать активированный, чтобы изменить стиль большого пальца и скрыть тени большого пальца

вот описание атрибута официального сайта активирован ---- класс применяется к элементам track и thumb, чтобы активировать вложенные стили JSS, если активирован.

вот мой код

    const style={
         thumb:{
    bottom:15,
    '&$focused, &:hover':{
    boxShadow: `0px 0px 0px 0px`,
    }, 
  },activated:{
    boxShadow: `0px 0px 0px 0px` 
  },      
}

...

<Slider
      value={value}
      aria-labelledby="slider-image"  
      onChange={this.handleChange}
      max='10'
      step='1'
      classes={{
        container: classes.slider,
        track:classes.track,
        thumb:classes.thumb,
        focused:classes.focused,
        trackBefore:classes.trackBefore,
        trackAfter:classes.trackAfter,
        activated:classes.activated
      }}
      thumb={
        <Thumb num={value}/>
      }
  ...

Answer 1

Отвечая на ваш вопрос: как я могу использовать активированный, чтобы изменить стиль большого пальца и скрыть тени большого пальца?

• Вы должны создать тему, в этом примере я импортирую lensIcon, затем я применяю свою тему:

  import LensIcon from "@material-ui/icons/LensOutlined";
  import { createMuiTheme } from "@material-ui/core/styles";
  
  const themeIcon = createMuiTheme({
    shadows: Array(25).fill('none')
  })
  
  <Slider
    value={value}
    aria-labelledby="slider-icon"
    onChange={this.handleChange}
    thumb={<LensIcon theme={themeIcon} />}
  />