doc: 更新示例

Author: ArgoZhang

src/BootstrapBlazor.Server/Components/Samples/Html2Images.razor

@@ -2,22 +2,21 @@
 
 <h3>@Localizer["Html2ImageTitle"]</h3>
 
-<h4>@Localizer["Html2ImageDescription"]</h4>
-
-<Tips>
-    <div>@((MarkupString)Localizer["Html2ImageNote"].Value)</div>
-</Tips>
+<h4>@Localizer["Html2ImageIntro"]</h4>
 
 <DemoBlock Title="@Localizer["Html2ImageElementTitle"]" Introduction="@Localizer["Html2ImageElementIntro"]" Name="Normal">
-    <section ignore>
-        <p>@((MarkupString)Localizer["Html2ImageElementDesc"].Value)</p>
-        <Button OnClickWithoutRender="OnExportAsync" Text="@Localizer["ExportButtonText"]" Icon="@_exportIcon"></Button>
-    </section>
+    <Button OnClickWithoutRender="OnExportAsync" Text="@Localizer["Html2ImageButtonText"]" Icon="fa-solid fa-image"></Button>
     <Table TItem="Foo" Items="@Items.Take(3)" Id="table-9527">
         <TableColumns>
             <TableColumn @bind-Field="@context.DateTime" Width="180" />
             <TableColumn @bind-Field="@context.Name" Sortable="true" Filterable="true" />
             <TableColumn @bind-Field="@context.Address" />
         </TableColumns>
     </Table>
+    @if (!string.IsNullOrEmpty(_imageData))
+    {
+        <section ignore>
+            <img src="@_imageData" class="w-100" />
+        </section>
+    }
 </DemoBlock>

src/BootstrapBlazor.Server/Components/Samples/Html2Images.razor.cs

@@ -27,7 +27,7 @@ public partial class Html2Images
 
     [Inject]
     [NotNull]
-    private IStringLocalizer<Html2Pdfs>? Localizer { get; set; }
+    private IStringLocalizer<Html2Images>? Localizer { get; set; }
 
     [Inject]
     [NotNull]
@@ -36,7 +36,7 @@ public partial class Html2Images
     [NotNull]
     private List<Foo>? Items { get; set; }
 
-    private string? _exportIcon = "";
+    private string? _imageData;
 
     /// <summary>
     /// <inheritdoc/>
@@ -46,12 +46,11 @@ protected override void OnInitialized()
         base.OnInitialized();
 
         Items = Foo.GenerateFoo(LocalizerFoo);
-
-        _exportIcon = IconTheme.GetIconByKey(ComponentIcons.TableExportPdfIcon);
     }
+
     private async Task OnExportAsync()
     {
-        var stream = await Html2ImageService.GetStreamAsync("#table-9527", new Html2ImageOptions()
+        _imageData = await Html2ImageService.GetDataAsync("#table-9527", new Html2ImageOptions()
         {
             //IncludeStyleProperties = [
             //    $"{NavigationManager.BaseUri}_content/BootstrapBlazor.FontAwesome/css/font-awesome.min.css",
@@ -60,11 +59,13 @@ private async Task OnExportAsync()
             //    $"{NavigationManager.BaseUri}css/site.css"
             //]
         });
-        if (stream != null)
-        {
-            var reader = new StreamReader(stream);
-            var data = await reader.ReadToEndAsync();
-            reader.Close();
-        }
+        StateHasChanged();
+
+        //if (stream != null)
+        //{
+        //    var reader = new StreamReader(stream);
+        //    var data = await reader.ReadToEndAsync();
+        //    reader.Close();
+        //}
     }
 }