نحوه ایجاد یک کامپوننت ساده در Blazor چگونه است ؟

ایجاد یک کامپوننت در Blazor

• ابتدا یک پروژه از نوع Blazor Server Side در ویژوال استودیو ایجاد کنید.
• در پوشه Pages یک پوشه جدید به نام Components ایجاد کنید.
• روی پوشه Components کلیک راست کنید و گزینه Add و سپس Razor Components را انتخاب کنید.
• یک نام به Component خود بدهید و دکمه Add را بزنید. (نام کامپوننت در این مثال FirstComponent.razor انتخاب شده است.)

در کامپوننت FirstComponent کدهای زیر را بنویسید :

<div class="panel panel-default">
    <div class="panel-heading alert alert-info" style="text-align:center;">@Title</div>
    <div class="panel-body alert alert-success" style="text-align:center;">@Content</div>
</div>

@code {
    [Parameter]
    public string Title { get; set; }
    [Parameter]
    public string Content { get; set; }
}

همان طور که می بینید در این کامپوننت ما دو پارامتر هم به نام های Title و Content تعریف کردیم که می توان این پارامترها را موقع صدا زدن کامپوننت مقدار دهی کرد.

چگونه Component تعریف شده در Blazor را صدا بزنیم

خب حالا باید از کامپوننتی که بالا تعریف کردیم استفاده کنیم. استفاده از کامپوننت بسیار ساده است. کافیست در صفحه ای که قصد استفاده از کامپوننت را دارید دستور زیر را بنویسید :

<FirstComponent Title="عنوان" Content="متن دلخواه" />

در این مثال ما در صفحه index از این کامپوننت استفاده کرده ایم.

دانلود سورس

Razor Page چیست

کامپوننت در بلیزر چیست