创建动态收音机，但影响他人

Question

我已经创建了动态单选列表，它正在根据项目显示正确的数据。

   {item.responseType === "radio" && (
                          <div className="form-control-wrap">
                            {item.options
                              .split(",")
                              .map((list, indexRadio) => (
                                <Form.Check
                                  key={indexRadio}
                                  id={item.id}
                                  label={list}
                                  name="radio"
                                  value={list}
                                  onChange={(e, indexRadio) =>
                                    handleChange(e, indexQuestion)
                                  }
                                  type="radio"
                                />
                              ))}
                          </div>
                        )}

但是当我select选择一个选项时它会影响到其他选项，

就像我 select 问题 1 一样，它工作正常即：它是 select 只有一个选项，但是当转到问题 2 和 select 任何选项时它是 select 来自问题 2 的数据，但是，问题 1 选项将设置为初始状态。（它正在重置）

让我知道我该怎么做？

Answer 1

您正在使用对所有人都相同的 name="radio"，因此它处理来自同一组的所有单选按钮。对同一问题的所有选项使用相同的名称。它会解决你的问题。您可以使用问题 ID 作为单选按钮名称，以便该问题的所有选项都相同，并且与其他问题不同。

Answer 2

我认为使用这种变体可以帮助您实现目标：更改

中的密钥

<Form.Check
   key={item.id}
 />

创建动态收音机，但影响他人

Created the dynamic radio, but it is affect others

javascript

reactjs

react-bootstrap