2

我d3在我的反应应用程序中使用，在那里我使用 Typescript 编写代码。我有以下代码：

function mousemove() {
        // recover coordinate we need
        var x0 = xScale.invert(d3.mouse(this)[0]);
        var i = bisect(data, x0, 1);
        var selectedData = data[i]
        focus
            .attr("cx", xScale(selectedData.dateCreated))
            .attr("cy", yScale(selectedData[value]))
        focusText
            .html("x:" + selectedData.x + "  -  " + "y:" + selectedData.y)
            .attr("x", xScale(selectedData.dateCreated) + 15)
            .attr("y", yScale(selectedData[value]))
}

d3.mouse(this)[0]引发以下错误：

'this' 隐含类型为 'any'，因为它没有类型注释。

有什么建议可以解决吗？这个错误是常见的打字稿，但我不知道如何用d3.mouse函数解决它。

4

1 回答 1

2

我假设这是传递给 d3.js 事件处理程序的自定义方法（即.on('mousemove')）

您可以通过引用实际的事件处理程序来处理事件回调，而不是引用this可能被推断为当前类的实例。

.on('mousemove' (d, i) => {
  mousemove();
})

function mousemove() {
  const x0 = xScale.invert(d3.mouse(d3.event.currentTarget));
  // do the rest
}

或者，您可以将节点传递给您的mousemove()函数。根据文件，

如果选择器是一个函数，则对每个选定元素进行评估，依次传递当前数据 (d)、当前索引 (i) 和当前组（节点），并将 this 作为当前 DOM 元素 (节点[i]）。

.on('mousemove' (d, i, n) => {
  const node = d[i]
  mousemove(node);
})

function mousemove(node) {
      // do the rest
}
于 2019-11-10T12:49:53.287 回答