鍍金池/ 問答/HTML/ 關(guān)于Radio單選框問題 antd

關(guān)于Radio單選框問題 antd

用到了antd單選框,發(fā)現(xiàn)遍歷多個radio后,估計Radio控件中的每行value值都重復(fù)導(dǎo)致的,我點擊選中一個,其它也跟著選中,我想點擊每行的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>
      );
}
回答
編輯回答
薔薇花

你好 我也遇見了這個問題 請問怎么解決?

2018年4月29日 21:37
編輯回答
柚稚

因為每一組中的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>
    );
  }
2017年7月4日 06:05