[Blazor] Page 간 데이터 전송 (service 이용)

page 사이에서 데이터를 전송하기 위해 parameter로 넘기는 방식을 이용했었다.

하지만 parameter로 넘길 수 없는 형식의 데이터도 있었고,

parameter로 데이터를 넘기다 보니 쿼리스트링이 너무 길어져 보기에 좋지 않았다.

그래서 찾아보다 알게 된 service를 이용하는 방법 !

 

Index.razor 페이지에서 name이라는 string 변수의 값을 변경하는데,

이 name이라는 변수를 test.razor 페이지에서 접근해야 한다고 가정하고 예제를 만들어보겠다.

 

우선, Service 클래스를 하나 만든다.

namespace TestProject.Services
{
	public class TestService
    {
    	public string name {get;set;}
    }
}

 

그리고 Startup.cs 파일에 Service를 등록한다.

public void ConfigureServices(IServiceCollection services)
{
    services.AddSingleton<Services.TestService>();
}

 

name이라는 변수의 값을 변경할 index.razor 파일에서 TestService를 등록하고,

Service 내 name이라는 변수의 값을 변경한다.

@page "/"
@inject TestService TestService

@code
{
	protected async override void OnInitialized()
    {
    	TestService.name = "hyokyeong";
    }
}

 

name이라는 변수의 값을 사용하고자 하는 Test.razor 파일에서도 TestService를 등록하고,

Service 내 name 변수에 접근하여 사용한다.

@page "/test"
@inject TestService TestService

<h1> @NAME </h1>

@code
{
	public string NAME;
    
    protected async override void OnInitialized()
    {
    	NAME = TestService.name;
    }
}

 

 

[Reference]

Blazor Singleton Pass Data between Pages | C# Tutorials Blog