如何从JSON创建组件树层次结构？ReactJS

const json = {
  type: 'div',
  props: {
    className: 'container',
    children: [
      {
        type: 'h1',
        props: {
          children: 'Hello, World!'
        }
      },
      {
        type: 'p',
        props: {
          children: 'This is a paragraph.'
        }
      }
    ]
  }
};

function createComponentFromJSON(json) {
  const { type, props } = json;
  const children = props.children || [];

  // 创建组件
  const component = React.createElement(type, props);

  // 递归创建子组件
  const childComponents = children.map(child => createComponentFromJSON(child));

  // 将子组件添加到父组件
  if (childComponents.length > 0) {
    return React.cloneElement(component, {}, ...childComponents);
  }

  return component;
}

const App = createComponentFromJSON(json);
ReactDOM.render(App, document.getElementById('root'));