Javascript 如何在React中更新数组中对象属性的状态？

我正在使用图表库绘制比特币价格图表

因此，我已经了解了如何更新嵌套对象的状态，也就是如何使用从API获取的“日期”数组更新“类别”的状态

但是，我做了很多尝试，无法找到如何用我从API获取的“price”数组更新“series”数组中“data”的状态

那么，究竟如何更新数组中对象的状态？或者如何将“price”数组传递到“data”对象中

代码：

import React from "react";

import ReactApexChart from "react-apexcharts";

class Charts extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            series: [
                {
                    name: "series1",
                    data: [],
                },
            ],

            options: {
                chart: {
                    height: 350,
                    type: "area",
                },
                dataLabels: {
                    enabled: false,
                },
                stroke: {
                    curve: "smooth",
                },
                xaxis: {
                    type: "date",
                    categories: [],
                },
                tooltip: {
                    x: {
                        format: "dd/MM/yy HH:mm",
                    },
                },
            },
        };
    }
    async componentDidMount() {
        const url = "https://api.coindesk.com/v1/bpi/historical/close.json";
        const res = await fetch(url);
        const data = await res.json();
        // console.log(data.bpi);
        let date = [];
        let i = 0,
            j = 0;
        for (let key in data.bpi) {
            if (i >= 23) {
                date[j] = key;
                ++j;
            }
            ++i;
        }
        console.log(date);
        this.setState((prevState) => ({
            ...prevState,
            options: {
                ...prevState.options,
                xaxis: {
                    ...prevState.options.xaxis,
                    categories: date,
                },
            },
        }));

        let price = Object.values(data.bpi);
        console.log(price);
    }

    render() {
        return (
            <div id="chart">
                <ReactApexChart
                    options={this.state.options}
                    series={this.state.series}
                    type="area"
                    height={350}
                />
            </div>
        );
    }
}

export default Charts;

从“React”导入React；
从“react-apexcharts”导入react-ApexChart；
类图表扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
系列：[
{
名称：“系列1”，
数据：[]，
},
],
选项：{
图表：{
身高：350，
类型：“区域”，
},
数据标签：{
启用：false，
},
笔划：{
曲线：“平滑”，
},
xaxis：{
键入：“日期”，
类别：[]，
},
工具提示：{
x:{
格式：“日/月/年HH:MM”，
},
},
},
};
}
异步组件didmount（）{
常量url=”https://api.coindesk.com/v1/bpi/historical/close.json";
const res=等待获取（url）；
const data=wait res.json（）；
//console.log（data.bpi）；
让日期=[]；
设i=0，
j=0；
for（让我们输入data.bpi）{
如果（i>=23）{
日期[j]=键；
++j；
}
++一,；
}
控制台日志（日期）；
this.setState（（prevState）=>({
…国家，
选项：{
…prevState.options，
xaxis：{
…prevState.options.xaxis，
类别：日期，
},
},
}));
让price=Object.values（data.bpi）；
控制台日志（价格）；
}
render（）{
返回(
);
}
}
导出默认图表；