从父级传递到子级的事件未定义

Question

父类组件：

toggleFunction = (event, ...otherProps) => {
    console.log(event) // EVENT GOT UNDEFINED
    console.log(otherProps) // THIS IS DISPLAYING WHAT IS NEED!
}

<Child updateFunction={(event) => this.toggleFunction(event,"PROPS-1","PROPS-2")}>

儿童功能组件：

const Child = ({ updateFunction }) => {
   ... OTHER CODE HERE
   <div onClick={() => updateFunction()}>Toggle</div>
}

我的问题是，当我在父类中创建事件并作为方法传递给子事件并执行父类中的父toggleFunction时。只有未定义的事件，其他道具正在正确显示。

我通过在子组件中创建事件和访问父组件找到了一个解决方案，但这对我来说并不像预期的那样有效！有人能解释我失败了什么吗。

提前感谢！

Answer 1

您需要将事件从onClick传递给updateFunction

<div onClick={event => updateFunction(event)}>Toggle</div>

或者让onClick为您调用它，因为第一个参数是事件：

<div onClick={updateFunction}>Toggle</div>