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

Home元件

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

Counter元件

我們可以在方案的Pages文件夾內。

@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文件。 它位於早前創建的Pages文件夾中。

Fetch元件

還有另一個名為"Fetch元件"的元件。 該組件還注入了一個用於後端伺服器開發的服務。 讓我們替換此代碼以從URL生成PDF，以更好地理解Blazor網頁開發的強大功能。

安裝IronPDF NuGet套件

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

開啟NuGet套件管理器控制台，並輸入以下命令：

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");
        }
    }
}

讓我們運行應用程序以查看輸出。

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

如下所示打開PDF文件。

我們只需三行代碼就從URL生成了一個PDF。 這就是IronPDF的強大功能。

IronPDF由Iron Software提供，是Iron Software's Iron Suite Products的一部分。 您可以節省金錢，通過購買整個Iron Suite，以購買其中兩個產品的價格購買五個產品。