我希望有一个组件根据鼠标悬停在其他组件的数据属性来设置它的内容<div>
。例如,我想要此组件的data-message
属性:
<ComponentA data-message="This is a message" />
当鼠标进入ComponentB
时设置ComponentA
的状态:
class ComponentB extends React.Component {
...
render() {
return (
<div>this.state.message</div>
);
}
}
可能有1000个具有此数据属性的组件。
如何使用单个鼠标事件监听器来侦听具有特定数据属性的任何组件?