我可以将react组件存储到状态吗？所以我可以动态地加载它

import React, { useState } from 'react';

const DynamicComponent = ({ componentName }) => {
  const [Component, setComponent] = useState(null);

  // 动态加载组件
  import(`./${componentName}`).then(module => {
    setComponent(module.default);
  }).catch(error => {
    console.error(`Failed to load component: ${componentName}`, error);
  });

  if (!Component) {
    return <div>Loading...</div>;
  }

  return <Component />;
};

// 使用动态组件
const App = () => {
  return (
    <div>
      <DynamicComponent componentName="MyComponent" />
    </div>
  );
};

export default App;