封装子组件onClick注意点

封装子组件时,onClick属性的定义注意点: 观点1:有2个父组件,第一个传了onClick,第二个不传,点击第二个时,执行了第一个的onClick(这个是错误的)
// 子组件
import React from ‘react’
const Demo = (props) => {
const { onClick } = props
return (
<div onClick={onClick} style={{
border: ‘2px solid red’
}}>
<h4>I am title</h4>
<div>I am content</div>
</div>
)
}
export default Demo
// 父组件
<Button onClick={() => {
console.log(‘1’)
}}></Button>
<Button></Button>
实际上,不传onClick,点击就无效,如图:

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理