Material UI多值Select的selected参数报Object is of type unknown如何解决

这个报错是TypeScript类型推断导致的，Material UI的Select组件默认没有绑定值的具体类型，因此renderValue回调的入参selected会被默认推断为unknown类型，无法直接调用数组的map方法，可以通过以下两种方式修复：

• 方案1：快速类型断言（适合临时修复、确定入参类型的场景）
  直接给selected参数加上和你的selectedSubUsecases一致的类型断言即可，比如你的值是字符串数组，修改代码如下：

  renderValue={selected => (
    <div className={classes.chips}>
      {/* 给selected加对应类型的断言 */}
      {(selected as string[]).map(value => (
        <Chip
          key={value}
          label={value}
          className={classes.chip}
        />
      ))}
    </div>
  )}
  

  如果你的值是数字数组，把string[]替换成number[]即可。
• 方案2：给Select组件指定泛型（更规范的类型写法，推荐）
  直接在Select组件上声明值的类型，TS会自动推断所有回调的参数类型，不需要额外做断言：

  {/* 泛型类型和你的selectedSubUsecases实际类型保持一致即可 */}
  <Select<string[]>
    id="selectedSubusecases"
    multiple
    value={stepsState.campaignOverviewStep.selectedSubUsecases}
    onChange={handleChangeMultiple}
    input={<Input id="select-multiple-chip" />}
    renderValue={selected => (
      <div className={classes.chips}>
        {selected.map(value => (
          <Chip
            key={value}
            label={value}
            className={classes.chip}
          />
        ))}
      </div>
    )}
    MenuProps={SubusecaseMenuProps}
  >
  

内容的提问来源于stack exchange，提问作者Grisecon Hillriegel