在反应中调用子组件内的函数参数

Question

由于我是 React 新手，所以我在父组件中有一个函数，如下所示

const openMenu = (item: Iitem) => {
    setNavOpen(item.id);
    closeMenu();
}

<ul>
    {navItems.map((navItem) => (
        <NavItem
            data={navItem}
            key={navItem.id}
            openMenu={openMenu}
        />
    ))}
</ul>

我正在尝试从我的子组件访问 openMenu 函数

像这样

<ItemButton
    id={data.id}
    onClick={openMegaMenu}
>
    Hello Test
</ItemButton>

我正在尝试使用类似 onClick={openMegaMenu(data)} 的函数，但它会抛出类似 uncaught-typeerror-cannot-read-属性-nextsibling-of-undefined 的错误。你能告诉我这里有什么问题吗？

Answer 1

你很接近！你想传递一个要调用的函数，而不是调用函数，所以下面应该可以工作

onClick={() => openMegaMenu(data)}

在反应中调用子组件内的函数参数

Call function parameter inside child component in react

reactjs

react-typescript