Razor C# (jak to działa dla programistów)

Wymagania wstępne

Zanim zagłębimy się w świat Razor, upewnij się, że masz zainstalowane następujące elementy:

1. .NET Core SDK
2. Visual Studio

Są one niezbędne, ponieważ zapewniają silnik widoków Razor oraz szablony projektów, których będziemy używać w tym samouczku. Ponadto mogą one działać na wielu systemach operacyjnych, co oznacza, że możesz z nich korzystać niezależnie od tego, czy używasz systemu Windows, Linux czy macOS.

Krok 1 Tworzenie nowego projektu Razor Pages

Otwórz program Microsoft Visual Studio i wykonaj następujące czynności:

1. Kliknij "Plik" > "Nowy" > "Projekt".

2. Na ekranie wyboru szablonu projektu wybierz "Blazor Server App".

   

3. Nazwij swój projekt "IronPDFExample" i kliknij "Utwórz".

   

4. Wybierz ".NET 7.0" lub nowszą wersję z listy rozwijanej.

   

Masz teraz nowy projekt Razor Pages.

Zrozumienie składni i plików Razor

Pliki Razor mają rozszerzenie .cshtml i łączą język C# (stąd "cs") z HTML. Gdybyśmy używali języka Visual Basic, rozszerzenie pliku zmieniłoby się na .vbhtml.

W oknie Solution Explorer znajdź i otwórz plik rozszerzenia .cshtml o nazwie "Index.cshtml". W tym miejscu zobaczysz połączenie kodu HTML i kodu C#. Takie połączenie jest możliwe dzięki Razor Parser.

<p>The current time is @DateTime.Now</p>

<p>The current time is @DateTime.Now</p>

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> The current time is @DateTime.Now</p>

@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

page model ReadOnly Property () As IndexModel
	ViewData("Title") = "Home page"
End Property

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<div class="text-center"> <h1 class="display-4"> Welcome</h1> <p> Learn about <a href="https://docs.microsoft.com/aspnet/core"> building Web apps @with ASP.NET Core</a>.</p> </div>

Wykorzystanie znaczników Razor do tworzenia treści dynamicznych

Razor Markup pozwala nam wstawiać kod po stronie serwera do naszego znacznika HTML. Możemy używać różnych konstrukcji kodu, takich jak bloki kodu, wyrażenia wbudowane i wyrażenia zakodowane w HTML.

<p>Hello, my name is @Model.Name</p>

<p>Hello, my name is @Model.Name</p>

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> Hello, my name is @Model.Name</p>

@{
    var name = "IronPDF";
}
<p>Hello, my name is @name</p>

@{
    var name = "IronPDF";
}
<p>Hello, my name is @name</p>

@
If True Then
	Dim name = "IronPDF"
End If
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> Hello, my name is @name</p>

@{
    var count = 5;
}

@if (count > 3)
{
    <p>The count is greater than 3.</p>
}

@{
    var count = 5;
}

@if (count > 3)
{
    <p>The count is greater than 3.</p>
}

@
If True Then
	Dim count = 5
End If

'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'@if(count > 3)
'{
'	<p> The count is greater than 3.</p>
'}

@{
    var fileFormat = "PDF";
    var message = "";

    switch (fileFormat) 
    {
        case "PDF":
            message = "You selected PDF.";
            break;
        default:
            message = "Invalid selection.";
            break;
    }
}

<p>@message</p>

@{
    var fileFormat = "PDF";
    var message = "";

    switch (fileFormat) 
    {
        case "PDF":
            message = "You selected PDF.";
            break;
        default:
            message = "Invalid selection.";
            break;
    }
}

<p>@message</p>

@
If True Then
	Dim fileFormat = "PDF"
	Dim message = ""

	Select Case fileFormat
		Case "PDF"
			message = "You selected PDF."
		Case Else
			message = "Invalid selection."
	End Select
End If

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> @message</p>

<p>@("Hello World")</p>

<p>@("Hello World")</p>

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<p> @("Hello World")</p>

@{
    var names = new List<string> { "John", "Doe", "Smith" };
}

@foreach (var name in names)
{
    <p>@name</p>
}

@{
    var names = new List<string> { "John", "Doe", "Smith" };
}

@foreach (var name in names)
{
    <p>@name</p>
}

@
If True Then
	Dim names = New List(Of String) From {"John", "Doe", "Smith"}
End If

'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'@foreach(var name in names)
'{
'	<p> @name</p>
'}

Zrozumienie pomocników tagów

Pomocniki tagów w ASP.NET MVC umożliwiają kodowi po stronie serwera tworzenie i renderowanie elementów HTML w plikach Razor. Są one nieco podobne do pomocników HTML, ale mają składnię bardziej zbliżoną do HTML. Przekształcają one elementy podobne do HTML w widokach Razor w znaczniki HTML wysyłane do przeglądarki klienta. Rozważmy następujący przykład kodu pomocnika tagu anchor:

<a asp-controller="Home" asp-action="Index">Home</a>

<a asp-controller="Home" asp-action="Index">Home</a>

Obsługa interakcji z użytkownikiem

Razor Pages wykorzystuje metody obsługi do zarządzania interakcjami użytkownika. Na przykład, aby obsłużyć przesyłanie formularza, możemy utworzyć metodę o nazwie OnPostAsync w odpowiednim pliku modelu strony naszej strony Razor.

public async Task<IActionResult> OnPostAsync()
{
    if (!ModelState.IsValid)
    {
        return Page();
    }

    // Perform some operation here

    return RedirectToPage("./Index");
}

public async Task<IActionResult> OnPostAsync()
{
    if (!ModelState.IsValid)
    {
        return Page();
    }

    // Perform some operation here

    return RedirectToPage("./Index");
}

Public Async Function OnPostAsync() As Task(Of IActionResult)
	If Not ModelState.IsValid Then
		Return Page()
	End If

	' Perform some operation here

	Return RedirectToPage("./Index")
End Function

Komentarze w Razor

Razor obsługuje również komentarze w stylu C#. Należy pamiętać, że komentarze Razor są po stronie serwera, co oznacza, że nie są wysyłane do przeglądarki. Wyglądają one następująco:

@* This is a Razor comment *@

@* This is a Razor comment *@

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'@* This is a Razor comment *@

A to jest komentarz wielowierszowy:

@*
    This is a multi-line Razor comment.
    It's useful when you have a lot to say.
*@

@*
    This is a multi-line Razor comment.
    It's useful when you have a lot to say.
*@

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'@* This is a multi-line Razor comment.It's useful @when you have a lot @to say. *@

Widoki i strony Razor mogą zawierać komentarze HTML. Komentarze te są widoczne w kodzie HTML wysyłanym do przeglądarki.

Przekazywanie modeli do strony Razor

Razor umożliwia przekazywanie modeli na stronę z serwera. Dyrektywa @model służy do określenia typu przekazywanego obiektu. Dostęp do tej właściwości modelu można uzyskać na stronie Razor, jak pokazano w poniższym przykładzie:

@page
@model ExampleModel

<h2>@Model.Title</h2>
<p>@Model.Description</p>

@page
@model ExampleModel

<h2>@Model.Title</h2>
<p>@Model.Description</p>

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'@page @model ExampleModel <h2> @Model.Title</h2> <p> @Model.Description</p>

Generowanie plików PDF za pomocą IronPDF w Razor

Discover IronPDF for .NET to popularna biblioteka, która pozwala programistom generować pliki PDF z HTML, obrazów, a nawet istniejących stron internetowych w środowisku .NET. Jest to doskonałe narzędzie do tworzenia raportów, faktur i wszelkich innych dokumentów, w których wymagany jest standardowy format wydruku. IronPDF działa idealnie w ramach frameworków ASP.NET MVC i ASP.NET Razor Pages.

Install-Package IronPdf

@using IronPdf;

@using IronPdf;

Dim IronPdf As [using]

@page "/pdf"
@using IronPdf;
@inject IJSRuntime JS

<PageTitle>Create PDF</PageTitle>

<h1>Create PDF</h1>

<div class="form-outline">
    <button class="btn btn-primary mt-3" @onclick="CreatePDF">Create PDF</button>
</div>

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

    private async Task CreatePDF()
    {
        var Renderer = new IronPdf.ChromePdfRenderer();
        Renderer.RenderingOptions.PaperSize = IronPdf.Rendering.PdfPaperSize.A2;

        var doc = Renderer.RenderUrlAsPdf("https://ironpdf.com/");

        using var Content = new DotNetStreamReference(stream: doc.Stream);

        await JS.InvokeVoidAsync("SubmitHTML", "ironpdf.pdf", Content);
    }
}

Wnioski

Pomyślnie opanowałeś podstawy Razor C# i dowiedziałeś się, jak zintegrować IronPDF w celu generowania plików PDF w ramach swojej aplikacji. Zacząłeś od utworzenia nowego projektu w Visual Studio, a następnie nauczyłeś się, jak używać składni Razor do tworzenia dynamicznych stron internetowych. Omówiono również, w jaki sposób IronPDF może być wykorzystywany do generowania plików PDF z kodu HTML, a nawet kompletnych widoków Razor.

Teraz, tworząc coraz bardziej zaawansowane aplikacje, możesz korzystać z potężnych funkcji oferowanych przez IronPDF. Możesz wypróbować IronPDF za darmo, a jeśli uznasz, że jest przydatny, możesz kupić licencję dostosowaną do swoich potrzeb.