你如何逃避一个组件的jsx，使其呈现为类型而不是计算？

Question

我想正常渲染一个组件，然后用于文档渲染它是如何需要输入的。

输入：

<Example date={date} />
<textarea>
  '<Example date={date} />'
</textarea>

当前输出：

The example thing today (some date here)
<textarea>
'The example thing today (some date here)'
</textarea>

预期输出：

The example thing today (some date here)
<textarea>
  <Example date={date} />
</textarea>

Answer 1

您应该将第二个<Example>作为字符串：

<Example date={date} />
<textarea>
  {'<Example date={date} />'}
</textarea>

Answer 2

我会选择这样的东西：

<Example date={date} />
<code>
&lt;Example date={date} /&gt;
</code>

也就是说，使用React渲染<code>元素，内容为字符串，使用<和>代替<和>。