對于上下文：我在 React 應用程序中運行 D3，并將 D3 更新模式綁定到 React 生命周期方法。問題： 當我const selection = select(".svg-circle-node-class").data(nodeArray)運行該函數時，D3 總是為我提供數組中的每個節點，無論新節點是否已添加到數組中。我希望該函數selection.enter()為我提供新的節點，并selection.exit()為我提供不存在的節點以供刪除，并且對于直接在此選擇上完成的任何操作而不使用，enter()應該為我提供所有剩余的節點，如下所示：這個問題導致我無法區分新舊項目，這導致我總是重新附加新的 SVG 元素，因此每次狀態發生變化時都會復制所有內容。我只想更新這些元素的值。我的具體情況如下：我有一個圖的實現，其結構如下：class Graph {  nodes: Node[];}class DirectedEdge {  from: Node;  to: Node;}class Node {  x: number;  y: number;  edges: DirectedEdge[];  id: string; // unique for each node}在我的反應組件中，我通過在組件狀態中保存圖形的實例來跟蹤圖形的狀態，如下所示：const n1, n2: Node = ...;interface IState {  g: Graph = new Graph(n1, n2), // constructor connects two graphs with an edge  degree: number // a parameter to change some shapes}我將圖表的初始化與componentDidMount生命周期方法聯系起來，這是執行此操作的函數：    /** Once HTML elements have loaded, this method is run to initialize the SVG elements using D3. */    private initializeGraph(): void {        const mainGroup = select(this.svgElement.current)            .append("g")            .attr("id", "main");        // append nodes svg group        this.nodeElements = mainGroup.append("g")            .attr("id", "nodes")            .selectAll<SVGCircleElement, Node>(".directed-graph-node")            .data<Node>(this.state.g.nodes, _ => _.id);        // append edges svg group        this.edgeElements = mainGroup.append("g")            .attr("id", "edges")            .selectAll<SVGPathElement, DirectedEdge>(".directed-graph-edge")            .data<DirectedEdge>(this.state.g.nodes.flatMap(_ => _.edges), _ => _.id);    }我將一個updateGraph函數與componentDidUpdate生命周期函數綁定在一起，導致每次狀態發生變化時都會調用它（即，在本例中，是由參數“ Degree”變化引起的。但我希望能夠更新（x ,y) 每次更新時每個節點的位置)。