React.js (JSX) で <pre>タグ内の改行が消えてなくなるんだけど？

JSX で

<pre>
foo
bar
</pre>

と書くと、レンダリングされる結果は

<pre>foo bar</pre>

となる。

いやいや、pre-formatted text を書きたいんだよ俺は。

幸いにも ES6 (ES2015 っていうのかな? babel です) を使っていたので、次のような方法が使えた。

<pre>
{`
foo
bar
`}
</pre>

これでレンダリング結果は

<pre>
foo
bar
</pre>

となる。

Template string が multi line サポートしてくれてて本当に良かった。