如何在接收到的属性上重置组件中所有JSX元素的类名？

import React from 'react';

class MyComponent extends React.Component {
  render() {
    const { children, className } = this.props;

    // 遍历所有子元素，并克隆它们并重置类名
    const clonedChildren = React.Children.map(children, child => {
      return React.cloneElement(child, { className });
    });

    return <div>{clonedChildren}</div>;
  }
}

// 使用示例
const App = () => {
  return (
    <MyComponent className="new-class">
      <div className="old-class">Child 1</div>
      <div className="old-class">Child 2</div>
      <div className="old-class">Child 3</div>
    </MyComponent>
  );
};

export default App;