redux-form renderField 类型无线电未定义值答案

【问题标题】：redux-form renderField type radio undefined valueredux-form renderField 类型无线电未定义值
【发布时间】：2017-06-10 22:39:03
【问题描述】：

我尝试为单选按钮实现 renderField，我可以显示它，但是当我单击单选字段时不会填充。当我检查控制台时，输入的值总是等于未定义！

这是我的代码：

render(){
    const {input, array, meta, label} = this.props;
    return(
      <div className="input-row">
        <div className="radio-box">
          {array.map((option,i) =>
            <div className="radio-field" key={i}>
              <input type='radio' name={option.name} onChange={() => {input.onChange('oui')}} value={option.value} checked={input.value === option.value} />
              {/* Try this before <input type='radio' {...input} name={option.name} value={option.value} checked={input.value == option.value}/> */}
              <label>{option.name}</label>
            </div>
          )}
        </div>
      </div>
    )
  }

我称之为：

<Field name="courtage" type="radio" label="Courtage ?" component={renderRadioField} array={selectOptions.courtage} {...courtage} />

SelectOptions.courtage 是一个对象数组。

【问题讨论】：

显示onChange处理程序类和方法代码。输入值应作为参数通过此处理程序
你能发布一个正确的代码示例吗？

标签： reactjs radio redux-form

【解决方案1】：

几个小时后，我找到了解决方案，我玩弄了状态：

  setRadioState(a) {
    const obj = {};
    obj[a.target.name] = a.target.value;
    this.setState(obj);
  }

  render(){
    const {input, array, meta, label, name} = this.props;
    return(
      <div className="input-row">
        <div className="label-box">
          <label>{label}</label>
        </div>
        <div className="radio-box">
          {array.map((option,i) =>
            <div className="radio-field" key={i}>
              <input type='radio' name={name} {...input} onChange={this.setRadioState.bind(this)} value={option.value} checked={this.state.name} />
              <label>{option.name}</label>
            </div>
          )}
          {/* <div className="errors">{meta.touched && ((error && <span>{error}</span>))}</div> */}
        </div>
      </div>
    )

【讨论】：