react usestate set 数据，要等下一次打开界面才能生效

bug 现象

在 Antd Pro 的 React 项目中，列表页，编辑一条记录。 为什么我点击了编辑按钮，弹窗显示的还是上一次打开的数据。

问题分析

这是一个 React 状态管理的问题。问题出在 CreateForm 组件的使用方式上。

当前的问题：

点击编辑按钮时，虽然 setCurrentRow(record) 更新了数据。但 CreateForm 组件没有正确响应新的 values prop

主要原因：

CreateForm 组件可能在内部维护了自己的状态。 当 values prop 改变时，没有及时更新表单的值。 建议修改 CreateForm 组件，添加 useEffect 来监听 values 的变化

CreateForm 代码

import { useEffect } from 'react';
// ...existing imports...

const CreateForm: React.FC<CreateFormProps> = (props) => {
  const [form] = Form.useForm();
  
  // 添加这个 useEffect 来监听 values 的变化
  useEffect(() => {
    form.setFieldsValue(props.values);
  }, [props.values]);

确实使用了 github copilot 推荐的改发，就能正常使用了。

微信关注我哦 👍

我是来自山东烟台的一名开发者，有感兴趣的话题，或者软件开发需求，欢迎加微信 zhongwei 聊聊， 查看更多联系方式