Javascript 在React/JSX中将大括号呈现为纯文本

我在React中将{和}显示为文本时遇到问题。我看到一个类似的问题，有人说用卷发把整根绳子包起来，但这不起作用：

let queries_block = this.state.previous_queries.map((dataset) => {
            return (<p>{"{{}}"}<p>)
        });

        if (results) {
            results_block = (
                <div>
                    <p>Queries:</p>
                    {queries_block}
                    <br/><br/>
                    <p>Results: {results_count}</p>
                    <JSONPretty id="json-pretty" json={results}></JSONPretty>
                </div>
            );
        } else {
            results_block = null;
        }

let querys\u block=this.state.previous\u querys.map（（数据集）=>{
返回（{{}}）
});
如果（结果）{
结果\u块=(
查询：

{querys_block}



结果：{Results\u count}

);
}否则{
结果_block=null；
}

返回（{{{}}）

导致

ERROR in ./src/components/app.js
Module build failed: SyntaxError: Unexpected token, expected } (47:13)

  45 |                     <JSONPretty id="json-pretty" json={results}></JSONPretty>
  46 |                 </div>
> 47 |             );
     |              ^
  48 |         } else {
  49 |             results_block = null;
  50 |         }

 @ ./src/index.js 15:11-38
webpack: Failed to compile.

./src/components/app.js中的

错误
模块生成失败：语法错误：意外标记，应为}（47:13）
45 |                     
46 |                 
> 47 |             );
|              ^
48 |}其他{
49 |结果_block=null；
50 |         }
@./src/index.js 15:11-38
网页包：未能编译。

---

有没有一种简单的方法可以避免jsx中的大括号？

我认为这只是一个打字错误。你有这个：

return (<p>{"{{}}"}<p>)

---

如果希望在JSX文档中以纯文本形式呈现大括号，只需使用HTML字符代码即可

左大括号{:

和#123；

---

右大括号}：

和#125
您甚至可以在ES6中使用字符串插值。
模板文字是允许嵌入表达式的字符串文字。可以使用多行字符串和字符串插值功能。
模板文本由反勾（
）（严重重音）字符括起，而不是双引号或单引号

eg: return (<p>{`{{}}`}</p>)

eg:return（{{{}}}
）

eg: return (<p>{`{{}}`}</p>)