reactjs - 如何删除相同值的多个单选按钮选择-react

Question

我有相同的值重复 3-4 次，如果我选择第一个值，其他相关值正在被选中我不想选择所有相同的值

前任：

const tuitions = [
{ value: 'ValueA', key: 'KeyA', name: 'Name A',timestamp:"2020-05-07T10:01:16.776+0000" },
{ value: 'ValueB', key: 'KeyB', name: 'Name B', timestamp:"2020-05-07T09:01:16.776+0000"  },
{ value: 'ValueC', key: 'KeyC', name: 'Name C' , timestamp:"2020-05-07T08:22:55.546+0000" },
{ value: 'ValueA', key: 'KeyA', name: 'Name A', timestamp:"2020-05-07T08:22:16.566+0000"  },
{ value: 'ValueA', key: 'KeyA', name: 'Name A', timestamp:"2020-05-07T08:01:16.77+0000"  },
];

const RadioButton = (props) => (
<label>
  <input 
    type="radio"
    name="Schools"
    value={props.value}
    onChange={props.onChange}
  />
  {props.name}
</label>
);

class Thingy extends React.Component {
 _RadioClickHandler = (e, name) => {
  }
 render() {
 return (
  <div>
    {tuitions.map(item=>(
       <RadioButton 
         value={item.value} 
         key={item.key} 
         name={item.name} 
         onChange={e => this._RadioClickHandler (e, item.name) }  
       />
       )
     )}
  </div>
);
}
}

// Render it
ReactDOM.render(
<Thingy />,
document.body
);

如果我选择名称 A，所有名称 A 相关的东西都会被检查，如何避免这种情况。

标签： reactjs

Answer 1

If you pass same value and select one of them all the other will be selected. That's how it works. You must need to pass unique value

Updated

Suppose the display name is same but you should pass the value unique. If you need you can make them ValueA1 ValueA2 ValueA3