我有以下类(class)(为了清楚起见,只留下了必要的详细信息):
class CalendarAndUsage extends React.
constructor(props) {
super(props);
this.handleClickOnDay = this.handleClickOnDay.bind(this);
}
handleClickOnDay() {
console.log("wtf");
}
render() (
return (<Calendar onDayClick={this.handleClickOnDay} />
)
}
}
Calendar 类如下所示:
class Calendar extends React.Component {
render() {
let weeks = this.props.weeks.map((week) => {
return (
<Week onDayClick={this.props.onDayClick} />
)
}
);
return (
<div className="calendar">
{weeks}
</div>
)
}
}
最后是 Week 类代码:
class Week extends React.Component {
render() {
/* lots of uninteresting code */
return <OffMonthDay onClick={() => this.props.onDayClick()}>{`${dayOfTheWeek} ${date.day}`}</OffMonthDay>
}
但是天知道什么原因,每当单击 OffMonthDay 元素时,onClick 事件都不会触发。我做错了什么吗?
编辑:
OffMonthDay 非常简单:
function OffMonthDay(props) {
return (
<div className="col-md-1 off-month-day day">
{props.children}
</div>
)
}
最佳答案
它不起作用,因为 OffMonthDay
没有 onClick
事件。
它应该看起来像这样
function OffMonthDay(props) {
return (
<div
onClick={props.onClick}
className="col-md-1 off-month-day day"
>
{props.children}
</div>
)
}
关于javascript - 传递的事件处理程序未触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40324025/