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



我有相同的值重复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相关的东西都会被检查,如何避免这种情况。

如果您传递相同的值并选择其中一个,则将选择所有其他值。这就是它的工作原理。您必须通过唯一值

已更新

假设显示名称相同,但您应该传递唯一的值。如果你需要,你可以制作ValueA1ValueA2ValueA3

最新更新