MUI Slider 'onChange' 不改变'值'

Question

我正在尝试用 MUI Slider 替换数字输入控件，尽管每当拖动 slider 时，“onChange”似乎不想更改任何内容。 它在调试中吐出 NAN 错误。

“警告：收到value属性的 NaN。如果这是预期的，请将值转换为字符串。”

我仍然有数字输入在它旁边运行。 在更改数字输入时，slider 会做出反应并相应地自行移动以显示当前值。

非常感谢您的帮助！

for (let i = 0; i < bones.length; i++) {
        let bone = bones[i].bone;
        
        controls.push(
            <div className="bone-control" key={i}>
                <p>{bones[i].name}</p>
                <div className="flex-container">
                    <div className="control">
                    <Slider
                        size="small"
                        aria-label="Small"
                        className="numeric-input"
                        min={-3.1}
                        max={3.1}
                        step={0.1}
                        value={Number(this.state[bone].x).toFixed(2)}
                        onChange={value => {
                            this.setState({[bone]: {x: value, y: this.state[bone].y, z: this.state[bone].z}});
                            window.changeRotation(bone, value, "x");
                        }}
                    />
                        <NumericInput
                            className="numeric-input"
                            min={-3.1}
                            max={3.1}
                            step={0.1}
                            value={Number(this.state[bone].x).toFixed(2)}
                            onChange={value => {
                                this.setState({[bone]: {x: value, y: this.state[bone].y, z: this.state[bone].z}});
                                window.changeRotation(bone, value, "x");
                            }}/>
                    </div>

Answer 1

您可以尝试 onChange={(event, value) => { this.setState({[bone]: {x: value, .... – tromgy 8 月 25 日 2:21