Javascript 将自定义React元素转换为其协调的普通子元素

我在描述组件对账流程时读到：

当它看到此元素时：

{
  type: Button,
  props: {
    color: 'blue',
    children: 'OK!'
  }
}

{
  type: 'button',
  props: {
    className: 'button button-blue',
    children: {
      type: 'b',
      props: {
        children: 'OK!'
      }
    }
  }
}

React将询问按钮它呈现给什么。该按钮将返回此选项 要素：

{
  type: 'button',
  props: {
    className: 'button button-blue',
    children: {
      type: 'b',
      props: {
        children: 'OK!'
      }
    }
  }
}

我的问题是，这个功能是直接公开的，还是以某种方式可以访问？比如我怎样才能把第一个物体转换成第二个

---

先问我为什么要问这个

我正在构建一个可排序的表，其中表中的单个元素可以是字符串或组件。如果它们是字符串，则排序很容易。在元素是React组件的情况下，我发现可以使用它来提取文本并使用它进行排序。这对于我定义的元素很好：

const el = <span>Text</span>;

const Com = () => <span>Text</span>;
const el = <Com />;

const el=文本；

但不是这样定义的：

const el = <span>Text</span>;

const Com = () => <span>Text</span>;
const el = <Com />;

constcom=（）=>文本；
常数el=；

出于我的目的，我希望对这些内容的处理完全相同，但是

react addons text content

无法处理它，因为前面提到的自定义元素和普通元素的表示方式不同。如果我可以从自定义元素表示转换为普通元素表示，那么一切都会正常工作

---

我知道另一种解决方案是为每个元素存储两个值，一个用于显示，一个用于排序。但如果我能不复制任何东西就离开，那对我来说似乎更好。尽管如此，建议还是很受欢迎的，显然我不是这方面的专家：）

要做到这一点并不容易，因为组件可以任意复杂，并且依赖于DOM。因此，这可能是一项昂贵的操作。像do这样的测试库提供了API来实现这一点，但对于我想象中的用例来说，这并没有什么意义。

调用

render（）

来获取返回值怎么样。处理功能组件和嵌套组件需要稍微复杂一点，但这可能可行，我以后还要处理它……React获取您提供的数据，并使用您定义的组件生成DOM。那么，为什么不对发送到组件的数据进行排序呢？它们将按照您对数据排序的顺序呈现。因为一些组件正在以各种不同的方式组装/转换数据，所以我必须编写一组额外的函数来复制该行为，然后存储所有数据的两个副本（一个转换为React组件，一个转换为字符串）-看起来很复杂，可能容易出错。