如何将 JSX 标签呈现为文本？

Question

有一个关于我的投资组合的想法，我将我的姓氏包裹在 JSX 组件标签中 - JOE - 将标签作为跨度内的普通旧段落文本，然后设置样式。 但是标签显然被我的代码编辑器解释为 JSX 标签，而不是文本，抛出错误。

有谁知道一个元素会环绕标签，将它们呈现为文本？ 尝试了一些东西，但无法弄清楚。

<h1> JOE <span className='neon'> < </span> BLOGGS <span className='neon'> /> </span> </h1>

Answer 1

要将 HTML 标记呈现为文本，您可以使用HTML 实体。 将<替换为< 和>与> ：

<h1> JOE <span className='neon'> &lt; </span> BLOGGS <span className='neon'> /&gt; </span> </h1>

Answer 2

您可以尝试将其包裹在花括号{} ，表示它是一个 JavaScript 表达式

  <h1> JOE <span className='neon'> {'<'} </span> BLOGGS <span className='neon'> {'/>'} </span> </h1>

Answer 3

您可以尝试{'/>'}将字符显示为文本

Answer 4

您可以使用直接{'<'} , {'>'}作为表达式或 HTML 实体<