ChartJs中数组上的setstate的ReactJs问题

import React, { Component } from 'react';
import { Line } from 'react-chartjs-2';

class ChartComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [10, 20, 30, 40, 50]
    };
  }

  updateChartData = () => {
    // 创建副本
    const newData = [...this.state.data];
    
    // 修改副本
    newData[2] = 35;
    
    // 更新状态
    this.setState({ data: newData });
  }

  render() {
    const { data } = this.state;

    return (
      <div>
        <Line data={{ labels: ['A', 'B', 'C', 'D', 'E'], datasets: [{ data }] }} />
        <button onClick={this.updateChartData}>更新数据</button>
      </div>
    );
  }
}

export default ChartComponent;