REACT.js 初始收音机 select

Question

我一直在尝试通过添加一些新功能来修改现有代码。我有这个函数，它根据变量 ACCREDITATION_TYPES:

呈现一组单选按钮

createRadioCalibration(name) {
    const { id, value, labels } = this.props;
    const _t = this.props.intl.formatMessage;

    const ACCREDITATION_TYPES = [
        [CALIBRATION_ACCREDITED, _t(messages.calibrationAccredited)],
        [CALIBRATION_NOT_ACCREDITED, _t(messages.calibrationNotAccredited)]
    ];

    return  <FormChoiceGroup
                    type = "radio"
                  values = {ACCREDITATION_TYPES.map(mapValueArray)}
                     key = {`${id}_${name}`}
                    name = {`${id}_${name}`}
                   value = {value[name]}
            handleChange = {this.handleFieldChangeFn(name)}
            />;
}

收音机默认都是不勾选的。单击此功能时将启动：

handleFieldChangeFn(name) {
    return (e) => {
        const { handleFieldChange, id } = this.props;
        handleFieldChange(id, name, e.target.value);
    };
}

表单渲染如下：

render () {

    const FIELDS = {
        [CALIBRATION]: this.createRadioCalibration(CALIBRATION),
    };

    return (
        <div className="">
           <label>{_t(messages.calibration)}</label>
           { FIELDS[CALIBRATION] }

我怎样才能 select 我想要的任何选项作为初始状态？现在只有两个选项，但如果有五个呢？另外，如何根据表单其他元素（即下拉菜单）的 onChange 事件来操作无线电 selection？

Answer 1

回答我的问题我得到了两个缺点：在构造函数中需要添加以下内容 this.props.handleFieldChange( 'id', 'radio_button_group_name', 'value_of_the_output_that_should_be_selected' );

这将 select 循环中的特定收音机。

REACT.js 初始收音机 select

REACT.js initial radio select

radiobuttonlist

reactjs