I am having problems displaying { and } as text in React. I saw a similar question that someone said to wrap the entire string in curlies, but this is not working:

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;

        }

The return (<p>{{{}}}<p>) causes

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.

Is there an easy way to escape curly braces in jsx?