Material-UI滑塊未更改活動范圍顏色

Question

我正在將Range Slider組件從零增加到十。 它應該為框內范圍內的值上色，但不是。

這是我的滑塊組件

export function VoteRange({ voteRange, setVoteRange }) {
  const classes = useStyles();

  const handleChange = (event, newValue) => {
    setVoteRange(newValue);
  };

  return (
    <div className={classes.root}>
      <Slider
        value={voteRange}
        onChange={handleChange}
        valueLabelDisplay="auto"
        min={0}
        max={10}
        marks={marks}
      />
    </div>
  );
}

控制器處理程序

const [voteRange, setVoteRange] = useState([0, 10]);

標記值

const marks = [
  {
    value: 0,
    label: '0',
  },
  {
    value: 5,
    label: 5,
  },
  {
    value: 10,
    label: 10,
  },
];

我已經閱讀了API，但是沒有找到任何解決方案

我希望看到帶有活動顏色范圍的標記，但是當Slider設置為0-10時，只有“ 0”和“ 1”處於活動狀態。 （當“滑塊”設置為0-9且僅降低“ 0”時）

Answer 1

將軟件包@ material-ui / lab從4.0.0-alpha.16更新到4.0.0-alpha.18可解決此問題