leafer-ui icon indicating copy to clipboard operation
leafer-ui copied to clipboard

DragEvent.END 无法被正常触发

Open zqq-nuli opened this issue 9 months ago • 1 comments


        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 也无法正常被触发

zqq-nuli avatar Mar 10 '25 21:03 zqq-nuli

将跟随的鼠标元素 hittable设为 false

leaferjs avatar Mar 11 '25 09:03 leaferjs