web-dev-qa-db-ja.com

React JSX、一重引用符でテキストをレンダリングする方法？例<p> I've </ p>

React JSXでは、次のテキストに単一引用符を含めることができますか？または、エスケープする必要があるかもしれない他の句読点を含めるにはどうすればよいですか？

 return (
   <div>
     <p>I've seen the movie.</p>
   </div>     
 )
javascriptreactjsreact-jsx
30
PrimeLens
return (
   <div>
     <p>{"I've seen the movie."}</p>
   </div>
 )
49
Nasrul Faizin

気にせず、そのまま機能します。

間違いとして強調したのはIDEでした

11
PrimeLens

＆quot htmlエンティティを使用して、テキストに引用を含めることができます。

<Text>I&quot;ve seen the movie.</Text>

出力：私は映画を見ました。

または、単一引用符が必要な場合は、以下のオプションを使用します。

<Text> I&apos;ve seen the movie.</Text>

<Text>{'I\'ve seen the movie.'}</Text>
{/* you can use both ticks and single quotes depending on your use. */}
<Text>{`I've seen the movie.`}</Text>

出力：私は映画を見ました。

4
abhishek kasana

これは、バックティック（`）意味のある文字列の場合。

元の質問のテキストは、構文の強調表示がオフになっていても正常に機能しますが、文字列を定数に移動することにより、エスケープ、強調表示、およびそれらの検索/更新が簡単になります。

const TEXT_FOR_MOVIE = `Some text that's "quoted"`

const TEXT_FOR_MOVIE = Some text that's "quoted"

0
Gregg B