leafer-ui
leafer-ui copied to clipboard
DragEvent.END 无法被正常触发
this.leafer.on(DragEvent.START, (e: DragEvent) => this.dragEvetStart(e));
this.leafer.on(DragEvent.DRAG, (e: DragEvent) => this.dragEventDrag(e));
this.leafer.on(DragEvent.END, (e: DragEvent) => this.dragEventEnd(e));
init() {
this.leafer = new Leafer({
view: "leafer-view",
usePartRender: true,
});
this.leafer.on(DragEvent.START, (e: DragEvent) => this.dragEvetStart(e));
this.leafer.on(DragEvent.DRAG, (e: DragEvent) => this.dragEventDrag(e));
this.leafer.on(DragEvent.END, (e: DragEvent) => this.dragEventEnd(e));
// 添加键盘事件监听
window.addEventListener("keydown", this.handleKeyDown.bind(this));
// 添加窗口大小变化监听
window.addEventListener("resize", this.handleResize.bind(this));
this.loadPage(this.book.viewed_pages);
}
dragEventEnd不会被触发,其他两个函数可以正常被触发,我在 拖动和拖动中进行了一个元素操作
this.eraserElement = new Rect({
x: (eraserPoint.x - this.eraserStyle.eraserSize) / 2,
y: (eraserPoint.y - this.eraserStyle.eraserSize) / 2,
width: this.eraserStyle.eraserSize,
height: this.eraserStyle.eraserSize,
fill: "rgba(255, 255, 255, 0.5)",
stroke: "#000000",
strokeWidth: 1,
cornerRadius: this.eraserStyle.eraserSize / 2, // 设置为宽高的一半,使其成为圆形
});
创建一个原型的元素跟随鼠标移动,我的想法是当移动结束,鼠标弹起应该出发删除该元素,但是END无法触发,最终使用window监听了鼠标弹起
也尝试了 PointerEvent.UP 也无法正常被触发
将跟随的鼠标元素 hittable设为 false