我試圖修改和複製我正在建立的元件的子元素，最近注意到我的 children 類型根據我傳遞 children 的方式而發生變化>.

例如，如果我將 JSX 當作孩子傳遞：

<MyComponent>
  <div>Hello</div>
</MyComponent>

當我檢查 MyComponent 中的 children 結構時，我可以看到該物件如下：

{
  '$$typeof': Symbol(react.element),
  type: 'div',
  key: null,
  ref: null,
  props: { children: 'hello' },
  _owner: null,
  _store: {}
}

由於 props.children 存在，所以 React.cloneElement 可以直接使用它。

如果我創建一個像這樣的功能元件：

const Hello: React.FC = () => <div>hello</div>;

並嘗試像這樣使用它：

<MyComponent>
  <Hello/>
</MyComponent>

那麼children物件的結構就變成這樣了：

{
  '$$typeof': Symbol(react.element),
  type: [Function: Hello],
  key: null,
  ref: null,
  props: {},
  _owner: null,
  _store: {}
}

我不能再使用React.cloneElement，除非我呼叫children.type()，但我找不到太多相關文件。

為什麼會發生這種情況？這是預期的嗎？呼叫 children.type() 是克隆整個子元素樹的唯一方法嗎？