マウスで完全に機能するいくつかの基本的なイベントを取得したいだけですが、表面の鉛筆ではクレイジーな結果になります。ReactJS はポインター型をサポートしていないため、Mouse イベント型を使用することを考えました。Move と Down と Up は、鉛筆で数回クリックした後は呼び出されなくなりました。
完全なコードではありません:
onDownCanvasEvent(e){
e.preventDefault();
console.log("DOWN");
}
onUpCanvasEvent(e){
e.preventDefault();
console.log("UP");
}
onMoveCanvasEvent(e){
e.preventDefault();
console.log("Move");
}
onLeaveCanvasEvent(e){
e.preventDefault();
console.log("Leave");
}
onDragCanvasEvent(e){
e.preventDefault();
console.log("Drag");
}
onTouchCanvasEvent(e){
e.preventDefault();
console.log(e);
console.log("TouchMove");
}
constructor(props){
super(props);
}
render() {
return ( <canvas
onMouseMove={this.onMoveCanvasEvent.bind(this)}
onMouseUp={this.onUpCanvasEvent.bind(this)}
onMouseDown={this.onDownCanvasEvent.bind(this)}
onMouseLeave={this.onLeaveCanvasEvent.bind(this)}
onDrag={this.onDragCanvasEvent.bind(this)}
onTouchMove={this.onTouchCanvasEvent.bind(this)}
これは既知のバグですか、それとも回避策がありますか?
前もって感謝します!:)