Javascript React Hooks：单击按钮后如何填充模态组件？

我编写了一个模态组件：

modal

，它有以下几个支柱：

interface IProps {
    isShowing: boolean,
    hide(): void,
    category: ICategory
}

此模式是一种只包含一个输入的表单：

const [name, setName] = useState(props.category.name)

// Other bunch of code.

const editCategory = (e: React.FormEvent) => {
        
        e.preventDefault()
        const editedCategory: ICategory = {
            id: props.category.id,
            name
        }
        // Dispatch Action...
        props.hide()
    }


<label>Category Name</label>
<input value={name} onChange={e => { setName(e.target.value) }} />

<button onClick={editCategory}>Edit Category</button>
<button onClick={props.hide}>Cancel</button>

设置类别发生在我切换模式之后。我知道这是React中设置state hooks的正确的异步方式，但是，在我更新状态之后，有没有办法填充表单

我知道有一个叫做useffect的钩子，但是我进入了一个无限循环，试图显示模态

---

提前感谢。

使用效果是最好的方法。但是，“切换”功能在每个渲染上都是不同的对象，从而触发useEffect

为了防止出现这种情况，请使用“useCallback”钩子包装函数“toggle”，然后使用它

const toggleMemoized= useCallback(() => {
    toggle();
  }, []);

---

防止useffect钩子中出现无限循环。但是数据仍然没有出现在ModalForm中useEffect（（）=>{//Prevent to toogle the first render.if（category.id！==0&&！isShowing）{console.log（category）togglememorized（）}，[category]）`能否在useEffect中放置一个控制台日志，以查看类别id是否得到了正确更新。如果已安装react developer tools->请检查状态是否正在更新。

const updateCategory = (item: ICategory) => {
        setCategory(item)
        toggle()
    }

const toggleMemoized= useCallback(() => {
    toggle();
  }, []);