滞后滑块用作自定义TableCell组件时

Question

我将Slider用作自定义TableCell自定义组件（完整的CodeSandbox）的一部分：

const thWithSlider = () => (
      <th>
        <Slider
          classes={{ container: classes.slider }}
          value={value}
          onChange={this.handleChange}
        />
      </th>
    );

const cell = <TableCell component={thWithSlider} />

通过鼠标拖动更改值（单击以重新定位拇指时，滑块会正常工作）。

Answer 1

<TableCell component="th">
  <Slider classes={{ container: classes.slider }} value={value} onChange={this.handleChange} />
</TableCell>;

应该可以正常工作。它并不笨拙，但滑块总是被打断。不太清楚为什么。