MUI Radio Button触发onChange时出现spacing参数异常错误求助

问题分析 #

你的代码里RadioGroup的onChange逻辑存在问题：你手动对formik.values.isAddressFiscal取反来设置值，而没有使用RadioGroup回调返回的value参数。这种写法不仅会导致选中状态和表单值不匹配，还可能因为类型不一致触发错误（比如如果isAddressFiscal被意外设置为对象，取反操作会得到false，和Radio的布尔值类型冲突）。

修复方案 #

1. 修正onChange逻辑
   直接使用RadioGroup回调提供的value参数，这才是当前选中的Radio对应的值：

<Grid item xs={6} sm={6}>
    <Box display="flex" justifyContent="right" alignItems="center">
        <RadioGroup
            row
            aria-labelledby="isAddressFiscal"
            defaultValue={true}
            name="isAddressFiscal"
            onChange={(e, value) => formik.setFieldValue("isAddressFiscal", value)}
            value={formik.values.isAddressFiscal}
        >
            <FormControlLabel value={true} control={<Radio />} label="Si" />
            <FormControlLabel value={false} control={<Radio />} label="No" />
        </RadioGroup>
    </Box>
</Grid>

2. 检查Formik初始值类型
   确保initialValues里的isAddressFiscal是布尔类型（true或false），避免初始值为对象或其他类型导致的类型不匹配：

const initialValues = {
  isAddressFiscal: true,
  // 其他表单字段...
};

原因说明 #

RadioGroup的onChange回调会自动返回当前选中的Radio的value，直接用这个值更新Formik字段能保证状态和UI完全同步。之前手动取反的写法会打破这种同步，甚至在字段值异常时触发类型错误，这就是你遇到异常的核心原因。

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