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

首頁元件

按一下側邊功能表上的計數器。 您會發現按一下按鈕就會增加計數器，而不會改變或重新載入頁面。 在 Web 應用程式中動態增加計數器通常需要 JavaScript，但有了 Blazor，我們可以使用 C# 來實現。 這就是 ASP.NET 開發人員如此喜歡 Blazor 的原因。 它可以幫助 .NET 開發人員快速、輕鬆地建立 Web 應用程式。

計數器元件

我們可以在解決方案 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++;
    }
}

瀏覽器中對 /counter 的請求（如頂部的 @page 指令所指定）會導致 Counter 元件渲染其內容。

每次選擇 按一下我 按鈕：

• 執行 onclick 事件。
• 呼叫 IncrementCount 方法。
• currentCount 會遞增。
• 元件渲染後會顯示更新的計數。

每個 .razor 檔案都定義了可以重複使用的 UI 元件。

在 Visual Studio 中開啟 Index.razor 檔案。 Index.razor 檔案已經存在，因為它是在您建立專案時建立的。 它位於之前建立的 BlazorApp 目錄內的 Pages 資料夾。

擷取元件

還有一個元件名為"Fetch Component"。 此元件也會注入用於後端伺服器端開發的服務。 讓我們取代這段代碼，從 URL 生成 PDF，以便更好地瞭解 Blazor 網頁開發的強大功能。

安裝 IronPDF NuGet 套件。

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

開啟 NuGet Package Manager Console，並寫下以下指令：

Install-Package IronPdf

函式庫的安裝方式如下所示。

移除 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

讓我們執行應用程式看看輸出結果。

在輸入框中貼上 URL，然後按一下"產生 PDF"。 PDF 檔案將會產生，檔案可在應用程式資料夾中看到。

開啟 PDF 檔案，如下所示。

我們只用三行程式碼就從 URL 產生了 PDF。 這就是 IronPdf 的威力。

IronPDF 由 Iron Software 提供，它是 Iron Software 的 Iron Suite 產品的一部分。 您可以透過 購買完整的 Iron Suite 節省金錢，以購買其中兩個產品的費用購買五個產品。