- 已关闭。**此问题为not reproducible or was caused by typos。当前不接受答案。
这个问题是由打字错误或无法再重现的问题引起的。虽然类似的问题在这里可能是on-topic,但这个问题的解决方式不太可能帮助未来的读者。
22小时前关门了。
Improve this question
在我的应用程序组件中,我有一个函数作为 prop 传递给子组件。在这个子组件中,我有一个按钮,它有一个onClick,设置为从 prop 运行这个函数,但当我单击按钮时,它没有运行。不知道我错过了什么,谢谢。
应用程序jsx
function addGoalBtnClick() {
console.log("Yep")
}
return (
<div className="App">
<AddGoalBtn addGoalBtnfunc={addGoalBtnClick} />
</div>
);
子组件
function AddGoalBtn(props) {
console.log(props)
return (
<div className="add-goal-btn-wrapper">
<button onClick={props.AddGoalBtnfunc} className="add-goal-btn">
<FontAwesomeIcon icon={faPlus} size="2x" color="white" />
</button>
</div>
);
}
2条答案
按热度按时间qni6mghb1#
问题是你传递的 prop 的大写。
您将其作为
addGoalBtnfunc
(* 第一个字母是a
)传递,但在组件中将其作为props.AddGoalBtnfunc
( 第一个字母是A
*)使用,因此由于在props中找不到它,因此它是undefined
。7y4bm7vi2#
您在子组件中将addGoalBtnfunc大写是错误的,但在父组件中它没有大写。更改此设置应该可以解决此问题。