如何在反应中使用多选，就像选择了所有项目一样?

Question

<FormControl className="uk-margin-small-top uk-width-1-1 uk-margin-small-left" >
<InputLabel htmlFor="select-multiple-checkbox">Согласующие согласно матрице:</InputLabel>
<MuiSelect
multiple
value={selectResponsibles}
onChange={this.chooseResponsibles}
input={<Input id="select-multiple-checkbox" />}
renderValue={selected => (
<div>
{selected.map(value => (
<Chip key={value} label={value}  />
))}
</div>
)}
>
{persons.map(person => (
<MenuItem key={person.value} value={person.label} >
<Checkbox checked={selectResponsibles.indexOf(person.label) > -1} />
<ListItemText primary={`${person.label} - ${person.responsibleRole}`} />
</MenuItem>
))}
</MuiSelect>
</FormControl>

我需要怎么做，从一开始就选择了所有项目？ 如果他愿意，他可以从他们中删除某人？

Answer 1

选择哪些项目由MuiSelect组件上的"value"属性设置。在多选中，每个选项都有一个关联的值，选择组件的值是这些关联值的数组，指示当前选择的内容。因此，如果您希望默认选择所有项目，则只需将"selectResponsibles"变量初始化为所有项目选择值的数组。您可以使用简单的数组映射来生成此映射。

persons.map(person => person.label)