我想记录,每当用户将鼠标移到我的 <Canvas />
上时组件和控制台记录坐标。
这个有效:
<div onMouseMove={this._onMouseMove.bind(this)}>
<Canvas
dataURL={this.state.image}
textTop={this.state.textTop}
textBottom={this.state.textBottom}
fontSize={this.state.fontSize} />
</div>
</div>
但这不是(将 onMouseMove
从 div
移动到 Canvas Component
本身):
<div>
<Canvas
onMouseMove={this._onMouseMove.bind(this)}
dataURL={this.state.image}
textTop={this.state.textTop}
textBottom={this.state.textBottom}
fontSize={this.state.fontSize} />
</div>
</div>
我在这里做错了什么?
PS: 补充一下:
_onMouseMove(e) {
console.log(e.screenX);
console.log(e.screenY);
}
最佳答案
onMouseMove
就像您的自定义组件必须自行处理的任何其他 Prop 一样。
示例
class Canvas extends React.Component {
render() {
return <canvas onMouseMove={this.props.onMouseMove} />;
}
}
关于javascript - React 的 onMouseMove 在 div 上工作但不在自定义组件上工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51223854/