React报错：渲染AddBudgetModal时无法更新App组件问题排查

你的问题根源在AddBudgetModal组件的Modal配置上——你写了onHide={handleClose()}，这里的handleClose()会在组件渲染阶段就立即执行，而不是等到关闭事件触发时才调用。

因为handleClose函数内部调用了App组件的setOpen(false)，这相当于在AddBudgetModal渲染过程中直接修改了父组件App的状态，完全违反了React的规则：不能在渲染组件A时更新组件B的状态。

修复方法 #

把AddBudgetModal里的Modal组件行修改为：

<Modal show={show} onHide={handleClose}>

只传递函数引用handleClose，不要加括号执行它。这样只有当Modal触发关闭事件（比如点击关闭按钮、点击遮罩层）时，才会调用handleClose更新App的状态，不会再触发报错。

内容的提问来源于stack exchange，提问作者Mohd Mustafa Ameer