1. 在引用apexcharts-react时，需同时引用apexcharts和react-apexcharts。

import React, { useState, useEffect } from 'react'; import ApexCharts from 'apexcharts'; import ReactApexChart from 'react-apexcharts';

2. 在useEffect中初始化图表。

useEffect(() => { const chart = new ApexCharts(document.querySelector("#chart"), options); chart.render(); }, [options]);

3. 在useEffect的依赖项中添加options。

const [options, setOptions] = useState({}); useEffect(() => { setOptions({ ... }) }, []);

完整示例：

import React, { useState, useEffect } from 'react'; import ApexCharts from 'apexcharts'; import ReactApexChart from 'react-apexcharts';

const Chart = () => { const [options, setOptions] = useState({});

useEffect(() => { setOptions({ chart: { type: 'bar' }, series: [{ name: 'Sales', data: [30, 40, 45, 50, 49, 60, 70, 91, 125] }], xaxis: { categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep'] } }) }, []);

useEffect(() => { const chart = new ApexCharts(document.querySelector("#chart"), options); chart.render(); }, [options]);

return ( ); };

export default Chart;