How can I have New Line in Blazor

Question

I'm trying to create a newline, and having already looked on other forums, some are using '\n', '\r' or Environment.NewLine but personally nothing works. I give you the code and the result :

1:

string n1 = SomeText;
string n2 = AnotherText;
string beforeStr = n1 + Environment.NewLine + n2;

2:

string n1 = SomeText;
string n2 = AnotherText;
string beforeStr = n1 + '\r' + n2;

3:

string n1 = SomeText;
string n2 = AnotherText;
string beforeStr = n1 + '\n' + n2;

always same result :

SomeText AnotherText

Answer 1

The MarkupString solution will swallow/interpret all non-escaped html characters. This can lead to a XSS attack with dynamic user input strings.
The way to go here is to html-escape first and then replace all line breaks with <br />

@using System.Web
@using System.Text.RegularExpressions;

<div>
  @((MarkupString)Regex.Replace(
    HttpUtility.HtmlEncode(@multilineString), "\r?\n|\r", "<br />"))
</div>

The regex \r?\n|\r will replace \r (old Mac), \r\n (Windows) and \n (Unix)

This can also be implemented as a Component.

MultilineString.razor

@using System.Web
@using System.Text.RegularExpressions;

@((MarkupString)Regex.Replace(HttpUtility.HtmlEncode(@Value), "\r?\n|\r", "<br />"))

@code {
    [Parameter]
    public string Value { get; set; } = default!;
}

Now it's easier to use with <MultilineString Value=@yourInput />