How can I insert a line break into a <Text> component in React Native?

You can also do:

<Text>{`
Hi~
this is a test message.
`}</Text>

Easier in my opinion, because you don't have to insert stuff within the string; just wrap it once and it keeps all your line-breaks.

Solution 1:

<Text>
Hi~{"\n"}
this is a test message.
</Text>

Solution 2:

 <Text>{`
  line 1
  line 2
 `}</Text>

Solution 3:

Here was my solution of handling multiple <br/> tags:

<Text style={{ whiteSpace: "pre-line" }}>
    {"Hi<br/> this is a test message.".split("<br/>").join("\n")}
</Text>

Solution 4:

use maxWidth for auto line break

<Text style={{ maxWidth:200}}>this is a test message. this is a test message</Text>

This should do it:

<Text>
Hi~{"\n"}
this is a test message.
</Text>

Use:

<Text>{`Hi,\nCurtis!`}</Text>

Result:

Hi,

Curtis!