material-ui滑块-如何以编程方式将拇指对准焦点？

Question

我正在实现键盘导航以实现可访问性，并且我想以编程方式将滑块放在特定的条件下。有可能吗？

通常，我会使用React.Ref访问HTMLElement并在其上调用focus()，但是我无法访问Slider拇指的ref：

const MySlider: React.FC<{thumbRef: React.RefObject<HTMLSpanElement}> = (props) => {
  const [value, setValue] = React.useState<number>(30);
  const handleChange = (event: any, newValue: number | number[]) => {
    setValue(newValue as number);
  };

  // TODO this approach doesn't work
  return (<Slider thumbRef={props.thumbRef} value={value} onChange={handleChange} />);
}

...
const ref = React.createRef<HTMLSpanElement>();
<MySlider thumbRef={ref}/>
...
ref.current?.focus()

如何以编程方式专注于Slider拇指？