1.引用依赖组件
Markdig 和 Markdig.SyntaxHighlighting
2.创建单例注入实例
public class Program
{
public static async Task Main(string[] args)
{
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("app");
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
builder.Services.AddSingleton<Markdig.MarkdownPipeline>(sp =>
new Markdig.MarkdownPipelineBuilder()
.UseAdvancedExtensions()
.UseSyntaxHighlighting()
.Build());
await builder.Build().RunAsync();
}
}
@page "/editor"
@using Markdig
<[email protected]> @*Serilog*@
@inject MarkdownPipeline pipeline
<div class="row" style="height:600px;">
<div class="col-6 h-100">
<textarea class="form-control h-100" @bind-value="MarkdownText" @bind-value:event="oninput"></textarea>
</div>
<div class="col-6 h-100">
@((MarkupString)HtmlToRender)
</div>
</div>
@code {
public string MarkdownText { get; set; } = string.Empty;
private string _html = string.Empty;
public string HtmlToRender
{
get
{
try
{
_html = Markdown.ToHtml(MarkdownText ?? string.Empty, pipeline);
return _html;
}
catch(NullReferenceException nrx)
{
Console.WriteLine(nrx.ToString() + "Couldn't render markdown text!");
}
return _html;
}
}
}