Angular Material Mat-Tree dragover 事件触发不必要

问题描述

我有一个带有事件的 mat-tree,用于拖放功能我有两个组件(一个用于源树,另一个用于目标树)。我正在将项目从源树拖放到目标树上。

问题是当一个项目被拖放时,即使项目已经被放下,dropover 事件也会继续触发。

功能在 Edge 浏览器中正常运行,但在 Chrome 中不运行。在 Chrome 中,我们可以看到dragover 事件没有必要触发。

    <mat-tree-node *matTreeNodeDef="let node; when: hasmicrochild" matTreeNodePadding
                (dragover)="handleDragOver($event,node);" (dragend)="handleDragEnd($event,node);"
                (drop)="handleDrop($event,node);" [ngClass]="getStyle(node)">
                <button mat-icon-button matTreeNodetoggle [attr.aria-label]="'toggle ' + node.item">
                    <mat-icon class="mat-icon-rtl-mirror">
                        {{TreeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
                    </mat-icon>
                </button>
                <span class="checklist-leaf-node">
                    <span class="nodeContent">
                        <div *ngIf="node.queryType; else elseBlock">{{node.item}} ({{node.queryType}})</div>
                        <ng-template #elseBlock>{{node.item}}</ng-template>
                    </span>
                </span>
            </mat-tree-node>

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)