如何从选项表单中更改react中的图形？

import React, { useState } from 'react';
import BarChart from './BarChart';
import LineChart from './LineChart';

const GraphForm = () => {
  const [selectedGraph, setSelectedGraph] = useState('bar');

  const handleGraphChange = (event) => {
    setSelectedGraph(event.target.value);
  };

  return (
    <form>
      <label>
        Select a graph type:
        <select value={selectedGraph} onChange={handleGraphChange}>
          <option value="bar">Bar Chart</option>
          <option value="line">Line Chart</option>
        </select>
      </label>
    </form>
  );
};

const GraphRenderer = ({ selectedGraph }) => {
  if (selectedGraph === 'bar') {
    return <BarChart />;
  } else if (selectedGraph === 'line') {
    return <LineChart />;
  } else {
    return null;
  }
};

const App = () => {
  return (
    <div>
      <GraphForm />
      <GraphRenderer />
    </div>
  );
};

export default App;