Add newline character to a label

I have a label that is driven by database result.
This is the text from database:

Set Side A pressure to 1000 psi, wait until pressure is Stable.\nWhat is the pressure in Side B

I want to pass this to a single label, should look something like:

Set Side A pressure to 1000 psi, wait until pressure is Stable.
What is the pressure in Side B?

Labels cannot show line breaks. You will need a text area or markdown component.

I stand corrected. Just need the right style.

2 Likes

Sure they can, just set the wrap white-space css prop to pre or pre-wrap

Actually you might need to replace the /n with an actual line break char first (ascii 10 or 13?)

6 Likes

image

1 Like

I remembered doing something like this some time ago with a button. Haven't tested it on a label:

1 Like

It does work, on pretty much anything.
I use it on labels, tooltips, buttons...

1 Like

Phil is wrong but right

Gee, Phil, it looks like even when you're wrong you're right. What a guy!

12 Likes

It's OK, Phil's right 99.9999999999999999999999999999999999% of the time so I'm happy to let him be right when he's not as well :grin:

5 Likes

It's not noticeably affecting the stats... And still won't when @Eugene49 notices and repoints the solution mark. :laughing:

Component Text Area -> Stored in database -> Displayed in Markdown.
How do I store the value of text area in database such that it will preserve the newline?

The string in the text area should have \n characters for new lines (even if you don't see them). Just keep them in there.

Then add whiteSpace: pre in your markdown component styles.

1 Like