Reactjs 材质UI多选择不同的代码值和可见值-显示关键点而不是值

我正在使用基于文档示例的材质UI多重选择。我需要保存所选选项的id并显示名称，以便渲染对象。当我使用带有占位符的文档中的示例时，我看到的是ID而不是所选的名称。 见：

常量名称=[
{id:“a”，名字：“Oliver Hansen”}，
{id:“b”，名字：“Van Henry”}，
{id:“c”，名字：“April Tucker”}，
{id:“d”，名字：“拉尔夫·哈伯德”}，
{id:“e”，名字：“Omar Alexander”}，
{id:“f”，名字：“卡洛斯·阿伯特”}，
{id:“g”，名字：“米里亚姆·瓦格纳”}，
{id:“h”，名字：“Bradley Wilkerson”}，
{id:“我”，名字：“弗吉尼亚·安德鲁斯”}，
{id:“j”，名字：“Kelly Snyder”}
];
{
如果（选定。长度===0）{
返回占位符；
}
返回所选。加入（“，”）；
}}
MenuProps={MenuProps}
>
占位符
{names.map（name=>(
{name.name}
))}

选择只是执行您在

渲染值

函数中告诉它的操作：

            renderValue={selected => {
              if (selected.length === 0) {
                return <em>Placeholder</em>;
              }
              // This will return a comma-separated list of the values.
              return selected.join(", ");
            }}

---

也可以使用

名称

数据结构执行更复杂的

渲染值

，将值转换为名称，但这仅在您希望执行与所选值的默认渲染不同的操作（例如在芯片演示中）时才是必要的.

文档示例-您能给我提供关于MultiSelect芯片的相同解决方案吗？在我的情况下，还需要保存id显示名称（作为芯片设计）@Lee我建议您创建自己的问题，您可以更全面地描述您的问题，并包括您当前的代码等。从您的评论中，我不清楚您试图解决什么问题。

            renderValue={selected => {
              if (selected.length === 0) {
                return <em>Placeholder</em>;
              }
              // This will return a comma-separated list of the values.
              return selected.join(", ");
            }}

            renderValue={
              this.state.name.length > 0
                ? undefined
                : () => <em>Placeholder</em>
            }