如何将数据从props更新到d3函数？

<MyD3Component data={data} />

import React, { Component } from 'react';
import * as d3 from 'd3';

class MyD3Component extends Component {
  componentDidMount() {
    this.updateD3();
  }

  componentDidUpdate() {
    this.updateD3();
  }

  updateD3() {
    const { data } = this.props;

    // 使用D3函数处理数据并更新可视化
    // 例如：
    const svg = d3.select('svg');
    const circles = svg.selectAll('circle').data(data);

    circles
      .enter()
      .append('circle')
      .merge(circles)
      .attr('r', d => d)
      .attr('cx', (d, i) => i * 30 + 50)
      .attr('cy', 50);

    circles.exit().remove();
  }

  render() {
    return <svg></svg>;
  }
}

export default MyD3Component;