我想触发一个事件，onDragStop而不是在我的 React 应用程序中onChange使用 MUI Slider（以便事件触发的次数更少）。但是，文档表明onDragStop函数签名只有 mouseevent: function(event: object) => void。因此，以下适用于onChange：
<Slider onChange={ (e, val) => this.props.update(e, control.id, val) } />
但是，此事件没有第二个参数val：
<Slider onDragStop={ (e, val) => this.props.update(e, control.id, val) } />
如何获取onDragStop函数中Slider 的当前值？请注意，我无法使用this，因为它指的是父组件。
在较新版本的 Material UI 中，您可以使用：
<Slider
onChange={} // for example updating a state value
onChangeCommitted={} // for example fetching new data
/>
也遇到了这个问题！如果您在类中使用组件，请同时使用两个回调：
<Slider onChange={ (e, val) => this.val = val }
onDragStop={ (e) => this.props.update(e, control.id, this.val)
/>
如果您希望该Slider值成为组件状态的一部分，例如Slider当它发生变化时触发重新渲染（这也需要您传递this.state.value给Slider），您可以这样做：
class Parent extends Component {
render() {
return <Slider value={this.state.value} onChange={this.handleChange} onDragStop={this.handleDragStop}/>
}
handleChange = (event, value) => this.setState({ value });
handleDragStop = () => this.props.update(this.state.value);
}
否则，您可以将值分配给this：
class Parent extends Component {
render() {
return <Slider onChange={this.handleChange} onDragStop={this.handleDragStop}/>
}
handleChange = (event, value) => this.value = value;
handleDragStop = () => this.props.update(this.value);
}
<Slider
// invoked when the user drags the thumb
onChange={(_, newValue) => update(newValue)}
// invoked when the user drops the thumb
onChangeCommitted={(_, newValue) => update(newValue)}
/>
