关于Radio单选框问题 antd

Question

用到了antd单选框，发现遍历多个radio后，估计Radio控件中的每行value值都重复导致的，我点击选中一个，其它也跟着选中，我想点击每行的radio，其他行的radio不受控制，这个得怎么弄呢

render() {
    let types = ['aa', 'bb', 'cc'];
      return (
        <div onClick={(e) => this.radios(e)}>
          <RadioGroup onChange={this.onChange} value={this.state.value}>
            {
              types.map((data,index) => {
                return(
                  <Radio key={index} value={index}>{data}</Radio>
                );
              })
            }
          </RadioGroup>
        </div>
      );
}

Answer 1

因为每一组中的radio的value都是一样的呀.

  render() {
    let types = ['aa', 'bb', 'cc'];
    const groups = [1, 2, 3, 4];
    return (
      <div onClick={(e) => this.radios(e)}>
        {groups.map(g => {
          return(
            <RadioGroup onChange={this.onChange} value={this.state.value}>
              {
                types.map((data) => {
                  return (
                    <Radio key={`${g}_${data}`}>{data}</Radio>
                  );
                })
              }
            </RadioGroup>
          );
        })}
      </div>
    );
  }

Answer 2

你好 我也遇见了这个问题 请问怎么解决？

Answer 3

 onChange = (e) => {
        const {
            publicDataSources,
        } = this.state;
            publicDataSources.map((item, index) => {
                if (item.type === "scaleQuestions") {
                    item.list.map((itemsd, indexd) => {
                        if (itemsd.id === e) {
                            item.radioValue = e
                            this.setState({
                                publicDataSources: publicDataSources
                            });
                        }
                    })
                }
            })

    };