How to insert line break in Reacti-Native

Question

How can I insert a line break into a text component in React Native?

I checked here about my problem.
But my case is a little bit different.
So it doesn't work with that way.
This is my container code and it gives props to ContactInfo.

  return data.map( 
    (contact, i) => { 
      return (<ContactInfo contact={contact} key={i} />); 
    } 
  );

This is child component. It recieves props as contact.

      <Text>{this.props.contact.name}</Text>

And finllay, it gives the result 'name'.
I expect

David
John
Wade

But it gives 'DavidJohnWade'.

I can't put {"\n"} and ` into of child component since that is only one line.
How can i solve this?

Hi, you could try something this: {this.props.contact.name + "\n"} — needsleep, Dec 30 '18 at 19:28

score 0 · Accepted Answer · answered Dec 30 '18 at 19:42

0

Since you are passing a string, if you pass {"\n"} is just gonna see it as a string. try going the javascript way , use "\n" in your contact.name like "David \n John \n Wade"

answered Dec 30 '18 at 19:42

RegularGuy

3,516
1
12
29

How to insert line break in Reacti-Native

1 Answers1