D3.js：'this'隐式具有类型 'any'，因为它没有类型注释

Question

我使用3D.js库：

d3.select(`#myGraph`)
.append('svg')
const svg = d3.select(`#myGraph svg`).append('g')
const nodeEnter = svg.selectAll("g.node")
.data(nodes)
.enter()
.append("g")
.attr("class", "node")
.call(force.drag())
svg.selectAll(".node")
.each(function (d: any) {
d3.select(this)
.attr("data-source", d.id)
})

但我得到了错误："this"隐式具有类型"any"，因为它没有类型注释

如何在不忽略@ts的情况下修复它？

Answer 1

您可以在函数中将类型注释添加到this

svg.selectAll(".node")
.each(function (this: any, d: any) {
d3.select(this)
.attr("data-source", d.id)
})

或者，如果不需要显式的any，可以将其定义为SVGGraphicsElement，这是一种通用的SVG元素类型。如果您想更详细，可以使用更具体的类型(如SVGRectElement或SVGGElement(来更好地描述选择。

svg.selectAll(".node")
.each(function (this: SVGGraphicsElement, d: any) {
d3.select(this)
.attr("data-source", d.id)
})

Answer 2

我也遇到了同样的问题。我有一个棱角分明的应用程序，当我悬停在生成的矩形上时，我需要在其中显示信息。

这就是问题所在：

boxes.on('mouseover', (mouseEvent, d) => { d3.select(this) ...

同样的问题"；这个"；隐式键入任意。。。

事件具有名为currentTarget的当前元素所以不是：

d3.select(this)

用我的打字应用程序我有：

d3.select(mouseEvent.currentTarget)

这为我解决了问题。