orillusion
orillusion copied to clipboard
[BUG]: 鼠标右键点击事件无效
Bug描述
如案例所示,代码中添加了PointerEvent3D.POINTER_CLICK和PointerEvent3D.POINTER_RIGHT_CLICK的监听事件。 但是只有点击左键时才正确打印出文字 点击右键无反应
代码示例
https://codepen.io/OriIIusion/pen/LYadoJK
期待的结果
期待右键和左键一样,可以触发回调函数
引擎版本:
0.7.2
其他信息
以下是我的查错的路径与猜想 仅作为参考
下面的代码都是InputSystem.ts中的,对这两个函数开头增加了打印文字的代码,发现也是左键没问题,右键没反应
private mouseClick(e: MouseEvent) {
console.log("左");
this._pointerEvent3D.reset();
this._pointerEvent3D.mouseCode = e.button;
this._pointerEvent3D.mouseX = e.clientX - this.canvasX;
this._pointerEvent3D.mouseY = e.clientY - this.canvasY;
this._pointerEvent3D.type = PointerEvent3D.POINTER_CLICK;
this._pointerEvent3D.ctrlKey = e.ctrlKey;
this._pointerEvent3D.altKey = e.altKey;
this._pointerEvent3D.shiftKey = e.shiftKey;
this.dispatchEvent(this._pointerEvent3D);
}
private rightClick(e: MouseEvent) {
console.log("右");
this._pointerEvent3D.reset();
this._pointerEvent3D.mouseCode = e.button;
this._pointerEvent3D.mouseX = e.clientX - this.canvasX;
this._pointerEvent3D.mouseY = e.clientY - this.canvasY;
// this._pointerEvent3D.target = this;
this._pointerEvent3D.type = PointerEvent3D.POINTER_RIGHT_CLICK;
this._pointerEvent3D.ctrlKey = e.ctrlKey;
this._pointerEvent3D.altKey = e.altKey;
this._pointerEvent3D.shiftKey = e.shiftKey;
this.dispatchEvent(this._pointerEvent3D);
}
然后到了这里
canvas.addEventListener(
"click",
(e: MouseEvent) => {
//if right click
if (e.button == 2) {
this.isRightMouseDown = false;
this.rightClick(e);
} else if (e.button == 0) {
this.isMouseDown = false;
this.mouseClick(e);
}
},
true
);
猜想会不会是添加的click事件只有左键呢?
顺着canvas,来到了lib.dom.d.ts中,看到了下图
然后来到了这里https://developer.mozilla.org/zh-CN/docs/Web/API/Element/click_event
看到了这句话
在这里打印了一下e,发现只有左键点击的时候触发,右键并不会触发。
也就是说e.button只能是0,所以也就永远到不了this.rightClick(e);这里
resolved #418