javascript - 如何使用 TypeScript 停止 d3 中的事件传播？

Question

在 JavaScript 中，我有如下代码来在拖动某些东西时停止事件传播。

var drag = d3.behavior.drag()
  .origin(function(d) {
    return d;
  })
  .on('dragstart', function(e) {
    d3.event.sourceEvent.stopPropagation();
  })
  .on('drag', function(e) { ... });

在 TypeScript 中，我注意到 d3.event.sourceEvent 不存在。下面是对应的 TypeScript 代码。

let drag = d3.behavior.drag()
  .origin( (d, i) => {
    let data = d as any;
    return { x: data.x as number, y: data.y as number };
  })
  .on('dragstart',  (d, i) => { 
    //what to do here
   })
  .on('drag', (d, i) => { ... });

事实上，on 方法签名在 TypeScript 中已经改变。声明文件如下所示。

export module behavior {
 interface Drag<Datum> {
  on(type: string): (d: Datum, i: number) => any;
  on(type: string, listener: (d: Datum, i: number) => any): Drag<Datum>;
 }
}

以下是我与 d3 相关的 npm 依赖项。

• "@types/d3": "3.5.37"
• "d3": "^3.5.16"

知道如何在 TypeScript 中做同样的事情吗？

Answer 1

事实证明我必须做一些类型转换。

let event = d3.event as d3.BaseEvent;
event.sourceEvent.stopPropagation();