یکی از بهترین روش‌های انتقال داده‌ها بین page های مختلف در بلیزر register کردن یک singleton service و inject کردن آن به عنوان یک dependency به درون page ها و یا component هایی است که به آن نیاز دارند. در این آموزش، یک کلاس سی شارپ را ایجاد کرده و سپس آن را به عنوان یک Service در برنامه register خواهیم کرد. در مرحله بعد یک instance از این کلاس را به درون page ها تزریق خواهیم نمود و سپس از این Service برای انتقال داده‌ها بین component های مختلف Blazor استفاده خواهیم نمود.
با استفاده از تکنیکی که در این آموزش فرا خواهید گرفت به راحتی می توانید پارامترهایی را از درون یک component به یک component دیگر منتقل کنید. این موضوع حتی اگر component ها بر روی page های مختلف قرار داشته باشند نیز امکان پذیر است. این موضوع نه تنها برای تمیز نگه داشتن کدهای سی شارپ مورد استفاده قرار می گیرد؛ بلکه end user و یا کاربر نهایی یک تجربه یک شکل در تمامی صفحات برنامه خواهد داشت. علاوه بر این، با استفاده از یک service class به راحتی می توانید داده‌هایی را بدون نیاز به استفاده کردن از routing parameter های آموزش داده شده در قسمت قبل منتقل کنید.
راه اندازی اولیه
در ابتدای کار یک client-side Blazor WebAssembly به نام AppDataService را ایجاد کنید و یک فولدر جدید به نام Services را به پروژه اضافه نمایید. در فولدر Services یک کلاس سی شارپ به نام AppData.cs ایجاد کنید و در مرحله بعد در پوشه Pages یک Razor component جدید به نام Page2.razor اضافه نمایید.
ایجاد کردن یک Service Class
دقت کنید که در این آموزش عملیات مربوط به سری قبل را که با استفاده از rout parameter ها داده ها را منتقل می کردیم دوباره پیاده‌سازی خواهیم نمود. منتها این بار روش کار کمی متفاوت خواهد بود. در این قسمت هدف ایجاد کردن یک اپلیکیشن است که در آن بتوانیم مقدار یک property را بر روی یک پیچ تنظیم کرده و یک page دیگر از این تغییر مطلع شود و آن متغیر و مقدار آن را دریافت کند. رابطه بین page ها یک رابطه parent-child نیست. در رابطه با این موضوع نیز در قسمت های قبل صحبت کردیم. در واقع در این آموزش می خواهیم نحوه به اشتراک گذاشتن داده‌ها بین component های همزاد و یا اصطلاحاً sibling را بررسی کنیم. در کلاس AppData.cs یک property جدید شبیه به کد زیر به نام AppData ایجاد کنید.
namespace AppDataService.Services
{
public class AppData
{
public int Age { get; set; }
}
}
تا به اینجای کار کلاس AppData کار خود را به طور کامل انجام داده است. در حال حاضر این کلاس دارای یک property تک به نام Age می باشد که از نوع int است و هم قسمت get و هم قسمت set دارد.
منبع: وبسایت پرووید