C# Balzor Page 에서 NavMenu 로 데이터 전달하기

C# Balzor Page 에서 NavMenu 로 데이터 전달하기

 

Page 에서 버튼 클릭시 NavMenu 의 다른 Page 메뉴로 이동하게끔 처리하는 방법입니다.

1. NavMenu 객체를 담을 PublicScopeService 를 정의하고 등록합니다.

PublicScopeService.cs

namespace Blazor.RadzenTest.Services
{
    public class PublicScopeService : Dictionary<string, object>
    {
    }
}

Program.cs

builder.Services.AddScoped<PublicScopeService>();

PublicScopeService 는 dictionary 로 정의하여 키, 값의 형태로 데이터를 관리합니다.

 

2. PublicScopeService 를 이용한 처리

Shared/NavMenu.razor 에 아래처럼 @inject PublicScopeService 하고  pss["NavMenu"] = this; 

@using Blazor.RadzenTest.Services
@inject PublicScopeService pss
@inject NavigationManager Navigation

.....

@code {
    private bool collapseNavMenu = true;

    private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;

    private void ToggleNavMenu()
    {
        collapseNavMenu = !collapseNavMenu;
    }

    public void NavigatePage(string href)
    {
        Navigation.NavigateTo(href);
    }
}

@{
    pss["pss"] = this;
}

위처럼 하게되면 pss 이름으로 NavMenu 객체를 담게 됩니다.

 

3. Page 내부 버튼 클릭 시 NavMenu 처리하기

razor 페이지에서 @inject PublicScopeService 로 정의하고

버튼 클릭 이벤트에서 NavMenu 의 NavigatePage 호출합니다.

@using Blazor.RadzenTest.Services
@inject PublicScopeService pss

<RadzenButton Click="@MoveMenu" Text="Fetch Menu Move"></RadzenButton>

@code {

    private void MoveMenu()
    {
        if (pss["NavMenu"] is NavMenu navMenu)
        {
            navMenu.NavigatePage("fetchdata");
        }
    }
}

이렇게 하게되면 PublicScopeService 에 원하는 razor 페이지를 담아서 처리가 가능해집니다.

또한 공용으로 사용할 것들을 전역으로 담아 처리 할 수 있습니다.