MUI Autocomplete设置freeSolo时onChange值类型为Option|string的原因

出现这个类型提示是MUI Autocomplete组件的内置类型设计规则导致的，完全符合预期，不是类型推断错误：

• 组件的第四个泛型参数专门对应freeSolo属性的类型推导逻辑，当你传入<Option, true, any, true>的泛型时，最后一个true就是声明开启了自由输入模式，TS会自动将用户手动输入的string类型合并到onChange回调的value类型中，最终得到Option | string的联合类型。
• 四个泛型参数的对应规则如下：
  1. 第一位：下拉选项的基础类型，即你自定义的Option
  2. 第二位：多选模式开关，传true代表开启多选，返回值默认为数组类型
  3. 第三位：禁用清空按钮开关，控制是否展示输入框的清空操作按钮
  4. 第四位：自由输入（freeSolo）开关，传true即认定组件允许用户输入不在选项列表内的任意字符串值，自动将string类型并入回调值类型

相关复现代码如下：

type Option = { label: string; value: string };
return (
  <MuiAutocomplete<Option, true, any, true>
    freeSolo={true}
    onChange   // 此处value类型提示为Option | string 完全匹配类型定义
  />
);

对应调整方案 #

• 如果业务场景不需要用户手动输入自定义内容，只需要把freeSolo属性设为false，同时将第四个泛型参数也传false，onChange的value类型就会自动收窄为你定义的Option类型（多选场景下为Option[]）。
• 如果业务必须开启freeSolo能力，这个联合类型是和实际运行逻辑一致的：运行时用户既可以选中下拉列表里的Option对象，也可以手动输入任意字符串触发变更，回调拿到的值本身就存在两种类型可能，你需要在回调逻辑里做类型收窄，比如通过typeof value === 'string'判断分支，分别处理自定义输入和选项选中的逻辑即可。

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