凄く初歩的ですが、今後も使いそうだったので備忘録としてまとめ。
React Native でテキストを改行する方法についてです。
参考にさせていただいた記事はこちらから。
React Nativeで改行したい！やり方3選 – Qiita
https://qiita.com/hiroga/items/8a536555f8a895c9c505
さて、改行させる方法ですが、個人的に使いやすいと思ったのが下記の方法です。
なお、import 文等は割愛しております。ご了承ください。
<Text>テキスト1{"\n"}テキスト2</Text>
改行コードの \n を中括弧で囲みます。
これだけで、テキストを改行させることができました！
他にも、テンプレートリテラルという書き方を用いた方法や、コンポーネントを分けるという方法もありました。
// テンプレートリテラルを用いた書き方
<Text>{`
テキスト1
テキスト2
`}</Text>
// コンポーネントを分ける書き方
<Text>テキスト1</Text>
<Text>テキスト2</Text>
書き方は異なりますが、アプリ実行後の見た目はどれも同じなので、あとはもうお好みで好きな方を選択してください。
個人的には、{"\n"} を使う方法か、テンプレートリテラルを使う方法が、API からのデータ取得処理と組み合わせたときに使いやすいのではないかと思うのでお勧めです。
以上、React Native の Text コンポーネントでテキストを改行させる方法についてです。
ご参考になれば幸いです。
