我想将一个事件处理程序绑定到 React 中的多个组件。现在我设置className
为每个组件并用于event.currentTarget.className
确定哪个组件触发处理程序。
handleClick: function (e) {
var className = e.currentTarget.className;
if (className === "longComment") {
this.setState({showLongComment: !this.state.showLongComment});
} else {
this.setState({showShortComment: !this.state.showShortComment});
}
},
render: function () {
var topic = this.props.topic;
var shortComment = this.state.showShortComment ? '[-]' : '[+]';
var longComment = this.state.showLongComment ? '[--]' : '[++]';
return (
<li className="topic">
<div className="title">
<a target="_blank" href={api}>
{this.props.children.toString()}
</a>
<span className="longComment" onClick={this.handleClick}>
{longcomment}
</span>
<span className="shortComment" onClick={this.handleClick}>
{shortcomment}
</span>
</div>
{this.state.showLongComment ? <CommentList url={url} /> : null}
{this.state.showShortComment ? <CommentList url={url} /> : null}
</li>
);
}
React 中是否有任何本地方式可以知道哪个组件触发了事件处理程序?