Redux表单,单选按钮字段,如何支持变量值?

Ann*_*aSm 3 reactjs redux redux-form react-redux-form

在我的react redux表单中,我具有以下内容:

        <fieldset className="form-group">
          <legend>Radio buttons</legend>
          {this.props.job_titles.map(jobTitle => (
          <div className="form-check" key={jobTitle.id}>
            <label className="form-check-label">
              <Field
                name="job_title_id"
                component="input"
                type="radio"
                value={jobTitle.id}
              />
              {' '}
              {jobTitle.title}
            </label>
          </div>
          ))}
        </fieldset>
Run Code Online (Sandbox Code Playgroud)

这将正确呈现单选按钮,但是单击以选择单选按钮时,单选按钮永远不会设置为选中状态。您无法选择一个选项-表单已损坏。

什么是奇怪的是,如果我更新:value={jobTitle.id}value="anything"那么单选按钮可以选择。

我没有在redux表单文档中看到有关动态生成的单选按钮的任何内容。我究竟做错了什么?

谢谢

Tha*_*gbg 7

将值转换为字符串:

<Field
            name="job_title_id"
            component="input"
            type="radio"
            value={jobTitle.id.toString()}
          />
Run Code Online (Sandbox Code Playgroud)


sis*_*onb 3

将选中的属性设置为 astateprop,然后在单击处理程序中更新它。

<Field
    onClick={
        () => {
            this.setState((prevState) => {
                return {isChecked: !prevState.isChecked};
            });
        }
    }
    name="job_title_id"
    component="input"
    type="radio"
    checked={this.state.isChecked}
    value={jobTitle.id}
/>
Run Code Online (Sandbox Code Playgroud)