How to show placeholder in different lines in Text Input?

Viewed 1485

I have a TextInput whith multiline={true}. I want to know how to get its placeholder text like:

Hey There!
Want any Help?
Placeholder To The Rescue!

I tried some like placeholder='Hey There!\nWant any Help?' but didn't get what i wanted.

I'm sort of new to React Native. Helps would be greatly appreciated!

3 Answers

Found An Answer! Using braces made it render what I wanted. I figured out that React Native renders strings here as it is, but with the formatting given, if inside braces. For eg:

<TextInput
  multiline={true}
  placeholder='Hey There!\nHow are You?'
/>

With the above code rendered, the TextInput will look like:

HeyThere!\nHow are You?

But if you use braces like this:

<TextInput
  multiline={true}
  placeholder={'Hey There!\nHow are You?'}
/>

Then You will get the TextInput like:

Hey There!
How are You?

And That's Exactly what I wanted!

Well, Thank You Folks for Replying!

  <TextInput
    multiline={true}
    placeholder={'Hey There! \nWant any Help? \nPlaceholder To The Rescue!'}
    style={{height: 40, borderColor: 'gray', borderWidth: 1,fontSize:12}}

  />

screenshot of the solution you are looking for

try to use textarea html tag.That allow you to do multiline placeholder.

Related