MUI Switch设置defaultChecked出现非受控组件状态警告如何解决

• 核心是MUI Switch受控/非受控模式混用冲突：defaultChecked仅在组件首次渲染时生效，使用该属性代表你采用非受控模式，Switch状态由组件内部自主管理，你后续通过外部状态修改d.open的操作会被MUI判定为外部修改了非受控组件的初始状态，直接触发你收到的警告。
• 状态更新逻辑存在错误：你当前的状态更新代码直接修改了map循环的参数d，而非setDetails回调中拿到的最新状态副本prev里的对应项，同时仅对根对象p做浅拷贝，内部的schedule、days数组仍然是原引用，属于直接修改React状态的非法操作，会导致状态更新不生效。
• 列表渲染未添加唯一key，也可能导致组件复用过程中状态混乱。

1. 切换为完全受控模式：将Switch的defaultChecked属性替换为checked，显式绑定d.open作为状态来源
2. 修正状态更新逻辑：采用Immutable方式修改状态，所有嵌套层级的对象都生成新的引用，避免直接修改原状态
3. 给列表项添加唯一key属性，避免组件复用异常

修复后代码如下：

{details.schedule.days.map((d) => (
  <StyledTableRow key={d.day}>
    <TableCell>
      <Typography variant="subtitle1" fontWeight="bold">
        {d.day}
      </Typography>
    </TableCell>
    <TableCell>
      <FormControlLabel
        control={
          <Switch
            onChange={(e, checked) => {
              setDetails((prev) => {
                // 逐层生成新引用，不修改原状态
                return {
                  ...prev,
                  schedule: {
                    ...prev.schedule,
                    days: prev.schedule.days.map(item => 
                      item.day === d.day ? {...item, open: checked} : item
                    )
                  }
                }
              })
            }}
            checked={d.open}
          />
        }
        labelPlacement="bottom"
        label={d.open ? `Open` : `Closed`}
      />
    </TableCell>
  </StyledTableRow>
))}

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