因为我发现了这个问题已经过了几个小时了,而且每分钟都会变得怪异。主要问题是我无法设法使onChange事件在ToggleButtonGroup上运行。
我的代码:
class ToggleButtonGroupControlled extends React.Component {
constructor(props, context) {
super(props, context);
this.state = {
value: [1, 3],
};
this.onChange = this.onChange.bind(this);
}
onChange(value){
alert(value);
this.setState({ value });
};
render() {
return (
<ToggleButtonGroup
type="checkbox"
value={this.state.value}
onChange={this.onChange}
>
<ToggleButton value={1}>Checkbox 1 (pre-checked)</ToggleButton>
<ToggleButton value={2}>Checkbox 2</ToggleButton>
<ToggleButton value={3}>Checkbox 3 (pre-checked)</ToggleButton>
</ToggleButtonGroup>
);
}
}
现在,当我选择不同的&#34;复选框&#34;显示会相应更改,但警报永远不会被触发。此外,通过Chrome React扩展程序检查组件会显示状态不会发生变化,因此它会作为不受控制的组件离开,因为onChange处理程序永远不会被执行。
然而,奇怪的部分是docs demo中使用了相同的代码,它只是起作用。另一个奇怪的事情是,在演示中,我可以通过$r.props.onChange
使用React Developer Tools修改onChange处理程序,而在我的测试中我只是不能。 ToggleButtonGroup
使用uncontrollable
返回包含好的组件的不受控制的版本。不受控制的包装器具有通过道具传递的onChange,但受控组件附加了setAndNotify
附加的uncontrollable
函数,并且无法将其删除。
我真的不知道可能会出现什么问题,因为我认为我已经抛弃了所有合理的可能性,但我可能会遗漏一些明显的东西 - 我真的希望自己是这样。
提前感谢您的时间。