将 Blazor HTML 标记部分转换为 email 正文的字符串

Question

我有一个简单的 Blazor 组件，它接受一些输入（一些 object 和几个字符串的列表）并将它们格式化为简单的 HTML 以供显示，（从对象列表、简单文本等生成的表格。）

此 HTML 是一份报告，旨在在应用程序中显示给用户，并通过电子邮件发送给不同的人（通过 SendGrid）。 为了兼容性，我们使 email HTML 尽可能简单。

该组件工作正常，但是我不确定如何将组件的标记部分转换为一个简单的转义字符串 HTML，以便我可以将字符串传递给 SendGrid 并触发 email。

我知道 MarkupStrings，但我只是反向使用它们——编写一个包含 HTML 标签的字符串，该标签将正确显示在我的应用程序中。 我找不到任何以我需要的方式进行转换的建议。

有没有简单的方法让组件将其所有标记写入字符串，以便我可以将其 email 输出？

或者，我最好使用 static 方法编写一个.cs文件，该方法接收相关参数，将其呈现为 MarkupString，然后将字符串传递给 SendGrid 以获取 email 以及传递给 Z98AD8B3C99B3C44FZF 组件 inFA846EE展示？

Answer 1

当您使用 SmtpClient 时，解决方案很简单：

var message = new MailMessage() { IsBodyHtml = true, ... } ;

Answer 2

有没有简单的方法让组件将其所有标记写入字符串，以便我可以将其 email 输出？

不，您的 C# 代码没有简单的方法来执行此操作 - 您可以使用 JS Interop 从 dom 获取呈现的 HTML，但没有内置任何内容。

或者，我最好使用 static 方法编写 a.cs 文件，该方法接受相关参数，将其呈现为 MarkupString，然后将字符串传递给 SendGrid 以获取 email 以及传递给 Z98AD8B3C99B3C44FZF1 组件 in-846B3C44FZF1展示？

这是一种可能性 - 我无法评论它对您的价值，但如果您正在渲染的组件是 static，那么这是一种可行的技术，

Answer 3

最简单的方法是使用 JSInterop 来检索由浏览器生成的组件的 Html 标记。 假设您已经定义了一个子组件，并且想要检索其 html 源。 你可以这样做：

定义孩子...

选择性别。razor

<div id="selectGender">
    <h1>Select Gender</h1>

    <select>
        @foreach (var gender in genders)
        {
            <option>@gender</option>

        }
    </select>
</div>

@code {

    private List<string> genders = new List<string> { "Male", "Female", "Other" };
    
}

用法

@page "/"

@inject IJSRuntime JSRuntime

    <div>@((MarkupString) html)</div>
  
<SelectGender />

<button @onclick="GetHtml">Get Html</button>



@code{
    
    private string html;


    protected async Task GetHtml()
    {
        html = await JSRuntime.InvokeAsync<string>("myJsFunctions.getHtml");

    }

}

_Host.cshtml

<script>

        window.myJsFunctions =
        {
            getHtml: function () {
                return document.getElementById("selectGender").innerHTML;
            }
        };
    </script>