如何将属性传递给在React中返回组件的导入函数？

import React from 'react';

function MyComponent(props) {
  return <div>{props.name}</div>;
}

export function getComponent(name) {
  return <MyComponent name={name} />;
}

import React from 'react';

function withName(Component) {
  return function WithName(props) {
    return <Component name={props.name} />;
  };
}

function MyComponent(props) {
  return <div>{props.name}</div>;
}

export const WrappedComponent = withName(MyComponent);

import React, { createContext, useContext } from 'react';

const NameContext = createContext();

function MyComponent() {
  const name = useContext(NameContext);
  return <div>{name}</div>;
}

export function getComponent(name) {
  return (
    <NameContext.Provider value={name}>
      <MyComponent />
    </NameContext.Provider>
  );
}