Blazor 框架是什麼（開發者的工作原理教程）

Home 元件

class="content-img-align-center">

在側邊菜單中點擊 Counter。 您將看到點擊按鈕時會遞增計數器，而不會更改或重新加載頁面。 在網頁應用程式中動態增加計數通常需要使用 JavaScript，但使用 Blazor，我們可以使用 C# 實現這一點。 這就是為什麼 ASP.NET 開發者如此喜愛 Blazor。 它幫助 .NET 開發者快速輕鬆地構建 Web 應用程式。

Counter 元件

class="content-img-align-center">

我們可以在我們解決方案的 Pages 文件夾中的 Counter.razor 文件中查看 Counter 元件的代碼。

@page "/counter"
<h1>Counter</h1>
<p>Current count: @currentCount</p>
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
@code {
    private int currentCount = 0;

    // This method increments the counter value when the button is clicked
    private void IncrementCount()
    {
        currentCount++;
    }
}

如同 @page 指令中指定的那樣，當在瀏覽器中發出對 /counter 的請求時，Counter 元件會渲染其內容。

每次選擇 點擊我 按鈕時：

• 執行 onclick 事件。
• 調用 IncrementCount 方法。
• 增加 currentCount。
• 元件渲染以顯示更新的計數。

每個 .razor 文件都定義了一個可重用的 UI 元件。

在 Visual Studio 中打開 Index.razor 文件。 因為創建項目時已經創建了 Index.razor 文件，所以它已經存在。 它位於之前創建的 BlazorApp 目錄內的 Pages 文件夾中。

Fetch 元件

還有另一個名為“Fetch 元件”的元件。 此元件還注入了用於後端服務器開發的服務。 讓我們替換此代碼以從 URL 生成 PDF，以便更好地了解 Blazor Web 開發的威力。

安裝 IronPDF NuGet 套件

我們還可以在 Blazor WebAssembly 應用程式中安裝 IronPDF NuGet 套件，類似於正常的 ASP.NET Core 應用程式。

打開 NuGet 套件管理器主控台，並寫下以下命令：

Install-Package IronPdf

將顯示安裝該庫的情況如下。

class="content-img-align-center">

從 FetchData.razor 文件中刪除所有現有代碼，並添加以下代碼範例：

@page "/fetchdata"

@using myBlazorAPP.Data
@inject WeatherForecastService ForecastService

<h1>Generate PDF FROM URL</h1>
<p>This component demonstrates generating PDF from URL using IronPDF in Blazor Application</p>
<input type="text" @bind="URL" placeholder="URL HERE..."/>
<button @onclick="GeneratePDF">Generate PDF</button>

@code {
    private string URL { get; set; }

    // This method calls the service to generate a PDF document from a given URL
    protected async Task GeneratePDF()
    {
        await ForecastService.GeneratePDFfromURL(URL);
    }
}

以上是生成 PDF 文件的用戶端 Blazor 代碼。 它定義了一個按鈕和一個輸入框。 輸入字段綁定到 URL 變量。

現在，讓我們為我們的應用程式撰寫伺服器端代碼。

打開 WeatherForecastService.cs 文件，並用以下代碼片段替換所有現有代碼：

using System;
using System.Threading.Tasks;
using IronPdf;

namespace myBlazorAPP.Data
{
    public class WeatherForecastService
    {
        // This method generates a PDF file asynchronously from a provided URL
        public async Task GeneratePDFfromURL(string URL)
        {
            ChromePdfRenderer renderer = new ChromePdfRenderer();
            var pdfDoc = await renderer.RenderUrlAsPdfAsync(URL);
            pdfDoc.SaveAs(@"myFile.pdf");
        }
    }
}

using System;
using System.Threading.Tasks;
using IronPdf;

namespace myBlazorAPP.Data
{
    public class WeatherForecastService
    {
        // This method generates a PDF file asynchronously from a provided URL
        public async Task GeneratePDFfromURL(string URL)
        {
            ChromePdfRenderer renderer = new ChromePdfRenderer();
            var pdfDoc = await renderer.RenderUrlAsPdfAsync(URL);
            pdfDoc.SaveAs(@"myFile.pdf");
        }
    }
}

Imports System
Imports System.Threading.Tasks
Imports IronPdf

Namespace myBlazorAPP.Data
	Public Class WeatherForecastService
		' This method generates a PDF file asynchronously from a provided URL
		Public Async Function GeneratePDFfromURL(ByVal URL As String) As Task
			Dim renderer As New ChromePdfRenderer()
			Dim pdfDoc = Await renderer.RenderUrlAsPdfAsync(URL)
			pdfDoc.SaveAs("myFile.pdf")
		End Function
	End Class
End Namespace

讓我們運行我們的應用程式來查看輸出結果。

class="content-img-align-center">

在輸入框中粘貼一個 URL，然後點擊生成 PDF。 PDF 文件將被生成，並且該文件可以在應用程式文件夾中查看。

打開如下所示的 PDF 文件。

class="content-img-align-center">

我們僅用三行代碼便從 URL 生成了 PDF。 這就是 IronPDF 的強大之處。

IronPDF 由 Iron Software 提供，是 Iron Software 的 Iron 套件產品 之一。 您可以節省金錢，通過 獲取完整的 Iron 套件，以購買兩個產品的價格購買五套產品。