javascript - Angular 升级到 8 后出现拖动事件的问题。(使用 D3)
问题描述
我刚刚将我们的应用程序从 Angular 6 升级到 8(其中包括更新许多依赖项),并且遇到了拖动 d3 节点的问题。升级后,现在每当尝试拖动节点时都会出现此错误:
breadcrumbs.js:64 TypeError: Cannot read property 'ctrlKey' of null
at SVGRectElement.defaultFilter (drag.js:10)
at SVGRectElement.mousedowned (drag.js:51)
at SVGRectElement.<anonymous> (on.js:27)
at SVGRectElement.sentryWrapped (helpers.js:74)
at ZoneDelegate.invokeTask (zone-evergreen.js:391)
at Object.onInvokeTask (core.js:39679)
at ZoneDelegate.invokeTask (zone-evergreen.js:390)
at Zone.runTask (zone-evergreen.js:168)
at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:465)
at invokeTask (zone-evergreen.js:1603)
at SVGRectElement.globalZoneAwareCallback (zone-evergreen.js:1629)
当我查看drag.js
chrome 开发工具时,我得到了这个:
import {dispatch} from "d3-dispatch";
import {event, customEvent, select, mouse, touch} from "d3-selection";
import nodrag, {yesdrag} from "./nodrag.js";
import noevent, {nopropagation} from "./noevent.js";
import constant from "./constant.js";
import DragEvent from "./event.js";
// Ignore right-click, since that should open the context menu.
function defaultFilter() {
return !event.ctrlKey && !event.button;
}
...
如果我在里面断点defaultFilter()
并查看event
文件顶部的导入,它是一个具有正确目标的事件对象,除了函数(return !event.ctrlKey && !event.button
)内的事件对象之外的所有内容都是空的。
此外,我们this.d3.select(this.el.nativeElement).call(this.d3.drag().on('drag', onDrag))
在指令中使用将拖动事件侦听器添加到节点。
对此的任何见解将不胜感激!如果您需要更多信息,我很乐意提供更多信息。
解决方案
推荐阅读
- javascript - 设置文件打开路径
- crystal-reports - 在水晶报表中将科学记数法转换为数字
- ios - 滑动到 popViewController 在 iOS 13 中不起作用
- routing - 当我们在 stenciljs 中制作 web 组件时,如何处理其他框架的路由?
- java - 这个数组变量引用是如何起作用的?
- mysql - Laravel 雄辩的按日期分组,也返回空/零行
- azure - 使用 velero 在 AKS 托管磁盘(动态)上创建 pv 备份
- angular - 如何使用自定义 webpack 配置将 web worker 添加到 Angular 7 应用程序?
- installation - 如何在 Inno Setup 的安装后强制重启
- reactjs - 无法在 React Typescript 中使用 React-Router