请问 clear 后如何设置 theme？ #5018

我用 react 写了一个 demo，点击不同的按钮刷新container，但clear后无法通过chart.theme设置主题。

import React, { useEffect, useRef, useState } from 'react'
import './App.css'
import Header from '~/components/Header'
import { Chart } from '@antv/g2'

const App: React.FC = () => {
  const containerRef = useRef(null)
  const [chart, setChart] = useState<Chart | null>(null)
  const [isContainerReady, setIsContainerReady] = useState(false)

  useEffect(() => {
    if (containerRef.current) {
      setIsContainerReady(true)
      setChart(new Chart({
        container: 'container',
        theme: 'classic'
      }))
    }
  }, [containerRef])

  const resetChart = (): void => {
    if (chart) {
      chart.clear()

      chart.theme('classic')  // ==> 不设置主题会报错需要设置 theme，设置后会报错不可覆盖 classic
  }

  return (
    <>
      {
        isContainerReady && chart ? <Header chart={chart} resetChart={resetChart} /> : null
      }

      <div id="container" ref={containerRef}></div>
    </>
  )
}

export const graph = (chart: Chart): void => {
  chart
    .forceGraph()
    .data({
      type: 'fetch',
      value: 'https://assets.antv.antgroup.com/g2/miserable.json'
    })
    .scale(
      'color', {
        range: [
          '#4e79a7',
          '#f28e2c',
          '#e15759',
          '#76b7b2',
          '#59a14f',
          '#edc949',
          '#af7aa1',
          '#ff9da7',
          '#9c755f',
          '#bab0ab'
        ]
      }
    )
  void chart.render()
}

const data = [
  { genre: 'Sports', sold: 275 },
  { genre: 'Strategy', sold: 115 },
  { genre: 'Action', sold: 120 },
  { genre: 'Shooter', sold: 350 },
  { genre: 'Other', sold: 150 }
]

export const interval = (chart: Chart): void => {
  // 声明可视化
  chart
    .interval() // 创建一个 Interval 标记
    .data(data) // 绑定数据
    .encode('x', 'genre') // 编码 x 通道
    .encode('y', 'sold') // 编码 y 通道

  // 渲染可视化
  void chart.render()
}

const charts: Record<string, Render> = {
  条形图: interval,
  网络关系图: graph
}

interface HeaderProps {
  chart: Chart
  resetChart: () => void
}

const Header = memo(({ chart, resetChart }: HeaderProps) => {
  const render = (name: string): void => {
    resetChart()

    charts[name](chart)
  }

  return (
    <>
      {Object.keys(charts).map((name, idx) => (
        <button key={idx} onClick={() => { render(name) }}>
          {name}
        </button>
      ))}
    </>
  )
})

请问问题出在哪里？如何解决？