MUI 的 Autocomplete 组件在 multiple 模式下，defaultValue 必须与 options 中的选项对象类型完全一致（而非仅 label 字符串），否则默认值无法生效。本文详解问题根源、修复方案及最佳实践。
如何在 mui autocomplete 多选下拉框中正确设置默认选中项：mui 的 autocomplete 组件在 `multiple` 模式下，`defaultvalue` 必须与 `options` 中的选项对象类型完全一致（而非仅 label 字符串），否则默认值无法生效。本文详解问题根源、修复方案及最佳实践。
在使用 Material-UI（MUI）的 defaultValue 设为字符串数组（如 ["All"]），而实际要求它必须是 options 数组中对应对象的引用或深度等价对象——因为组件内部通过 isOptionEqualToValue 进行比对，且状态管理依赖对象身份或结构一致性。
你提供的代码中，options 是由 transformedNpaData 生成的对象数组：
const transformedNpaData = stateNPAValue[formData.state.value].map((label, index) => ({
label,
value: index.toString()
}));
// 示例：[{ label: "All", value: "0" }, { label: "959", value: "1" }, ...]
此时 transformedNpaData[0] 是一个完整对象 { label: "All", value: "0" }。但你的 defaultValue 却写成了：
defaultValue={[transformedNpaData[0].label]} // ❌ 错误：["All"] —— 字符串数组，类型不匹配
这导致 Autocomplete 无法在 options 中找到匹配项（isOptionEqualToValue(option, value) 中 value 是字符串 "All"，而 option 是对象，option.value === "All" 恒为 false），因此默认选中失效。
✅ 正确做法是传入对象数组：
defaultValue={[transformedNpaData[0]]} // ✅ 正确：[{ label: "All", value: "0" }]
同时，请确保 value prop（受控值）的初始状态也与之类型一致。你已用 useState([]) 初始化 selectedNamesState，这是合理的；但若需预设默认值，应初始化为相同结构：
const [selectedNamesState, setSelectedNamesState] = useState(transformedNpaData.slice(0, 1)); // 首项默认选中
或保留空数组，仅靠 defaultValue 实现非受控默认（注意：defaultValue 仅在组件首次挂载时生效，后续更新无效）。
此外，建议完善 isOptionEqualToValue 逻辑以增强鲁棒性（尤其当 value 可能为 undefined 或结构不一致时）：
isOptionEqualToValue={(option, value) =>
option?.value === value?.value && option?.label === value?.label
}
⚠️ 注意事项：
-
defaultValue仅作用于非受控模式（即未提供valueprop 或value为undefined）。你当前使用了value={selectedNamesState}，属于受控模式，此时defaultValue被忽略！真正决定初始选中状态的是selectedNamesState的初始值。 - 因此，若需受控默认值，请直接初始化
useState：const [selectedNamesState, setSelectedNamesState] = useState([transformedNpaData[0]]);
-
getOptionLabel和renderTags中的正则替换replace(/[\[\]']+/g, '')仅在 label 含特殊字符时必要；若 API 返回纯文本（如"All"），可省略以提升性能。
总结：Autocomplete 的默认选中本质是数据类型契约问题——options、value、defaultValue、isOptionEqualToValue 四者必须协同统一为同一对象结构。优先采用受控模式并正确初始化 state，是最可靠、可预测的实践方式。
