Typescript/D3 v4 - d3.drag()中的上下文.("end",this.dragended)

Question

我正在使用D3库来移动维恩图中的项目.当我停止拖动时,我想确定图表中项目的位置.

item.call(d3.drag()
    .on("start", this.dragstarted)
    .on("drag", this.dragged)
    .on("end", this.dragended)
);

这些是我在拖动开始时调用的函数,正在进行和结束.

dragended(d: TCMemberScenario, i: number) {
    d3.select(this).classed("active", false);
    d.calculateRoles();
    this.save();
}

这是拖动结束时调用的函数.我更新了图中的一些内容,然后我想调用save方法.这是班上的另一种方法.但是,此变量引用D3对象而不是类的实例.所以我得到一个"未捕获的TypeError:无法读取属性'保存'未定义"

我怎样才能从dragended方法中调用我班级的另一种方法？

Answer 1

要保持对"this"的引用,请使用以下箭头函数:

item.call(d3.drag()
    .on("start", (d, i) => this.dragstarted(d,i))
    .on("drag", (d, i) => this.dragged(d, i))
    .on("end", (d, i) => this.dragended(d, i))
);