javascript - React-Toolbox RadioGroup onChange 不起作用

Question

我正在尝试使用 react 工具箱单选按钮在我的 react 应用程序中设置单选按钮 https://github.com/react-toolbox/react-toolbox/tree/dev/components/radio .

这是我的代码:

import {RadioGroup, RadioButton} from 'react-toolbox/lib/radio';

class ClientsEdit extends Component {
    constructor(props) {
        super(props);
        this.bindLibs();

        this.state = {
            counterType: 1
        };
    }

   // Some other functions

    render() {
        return (
            <div>
                 <RadioGroup name='counterType' value={this.state.counterType} onChange={this.handleRadioButtonChange}>
                    <RadioButton label={t('clients:new.numeric')} value={1}/>
                    <RadioButton label={t('clients:new.alphanumeric')} value={2}/>
                 </RadioGroup>
            </div>
        );
    }

    bindLibs= () => {
    // ...
        this.handleRadioButtonChange = handleRadioButtonChange.bind(this);
    }
}

有两个问题:

1. 虽然我在声明，但没有选中 radioButton this.state.counterType 为 1
2. 尝试更改状态(通过单击)时，onChange 不是 触发

使用字符串而不是整数也不能解决问题。我在这里做错了什么？谢谢!

Answer 1

据我所知，因为您没有在您的状态下设置“值”，所以它不会检查任何单选按钮。此外，由于您没有指定“handleRadioButtonChange”，我建议您像这样在当前组件中定义它

handleRadioButtonChange = (value) => {
  this.setState({value});
};

查看此处自述文件中给出的示例:https://github.com/react-toolbox/react-toolbox/tree/dev/components/radio