Javascript 如何在Select中保留已选中的值？

我是ReactJS的初学者，在选择方面有问题。我有一个

Select

，它用

MenuItem

呈现一些名称

我需要的是，

Select

已经在名称列表中选中了一些名称。例如，

Van Henry

和

Ralph Hubbard

的名字已经包含在列表中

为了知道应该标记列表中的哪个项目，如果一个数组中的值也在另一个数组中，则比较两个数组。所以我在名单上标出了这个名字

我会展示一张图片，我想这样可以更好地解释：

这是我放在CodeSandBox上的代码：

---

有人能帮我吗？提前感谢。

更新

中传递给
renderValue
prop的值

personName.join（“，”）}
MenuProps={MenuProps}
>
正在检查personName
以查看是否应在此处检查值：
-1}/>

<Select
  labelId="demo-mutiple-checkbox-label"
  id="demo-mutiple-checkbox"
  multiple
  value={personName}
  onChange={handleChange}
  input={<Input />}
  renderValue={(selected) => personName.join(", ")}
  MenuProps={MenuProps}
>

personName
在此处初始化为空数组：
const[personName，setPersonName]=React.useState（[]）

const[personName，setPersonName]=React.useState（[…names2]）会将names2数组中的所有名称设置为默认选中

编辑：在使用更多信息编辑问题后编辑您可以使用从
名称中创建一个新的
数组
，该数组位于
名称2
上。然后使用设置您的
personName
状态

filter（）
方法创建一个新数组，其中包含通过所提供函数实现的测试的所有元素

React.useffect（（）=>{
setPersonName（names.filter（（name）=>names2.includes（name））；
}, []);

嘿@bertdida，你所做的对我来说非常有用。但当我看到你的答案后，我发现我大便了。我把我的问题搞错了，我已经在StackOverflow上解决了。一千次道歉，我把问题弄错了，我已经在StackOverflow上解决了。千方百计的道歉谢谢你，戴伦斯，你的回答是有效的，但目前，伯蒂达的解决方案对我更有效。。谢谢抱歉Codemax，我的问题搞错了，我已经在StackOverflow上解决了。一千个道歉不用担心这对我来说很好，谢谢你Bertida！！！