C# Blazor LifeCycle 확인

Blazor LifeCycle 확인

 

출처 : Microsoft

Blazor 에서 제공되는 이벤트 함수들이 있는데 해당 이벤트들을 실제로 로그를 찍어본 결과 입니다.

 

@page "/lifecycletest"

<PageTitle>LifeCycleTest</PageTitle>
<h1>----------------------------------------------</h1>
<h1>LifeCycleTest</h1>

<button class="btn btn-primary" @onclick="IncrementCount">Click me (@currentCount)</button>

<h3>@logMessage</h3>

@code {

    [Parameter]
    public int Increment { get; set; } = 1;

    private int currentCount = 0;
    private string logMessage = string.Empty;

    private void IncrementCount()
    {
        currentCount += Increment;
    }

    protected override void OnInitialized()
    {
        logMessage += "OnInitialized → ";
        base.OnInitialized();
    }

    protected override Task OnInitializedAsync()
    {
        logMessage += "OnInitializedAsync → ";
        return base.OnInitializedAsync();
    }

    public override Task SetParametersAsync(ParameterView parameters)
    {
        logMessage += "SetParametersAsync(ParameterView parameters) → ";
        return base.SetParametersAsync(parameters);
    }

    protected override void OnParametersSet()
    {
        logMessage += "OnParametersSet → ";
        base.OnParametersSet();
    }

    protected override Task OnParametersSetAsync()
    {
        logMessage += "OnParametersSetAsync → ";
        return base.OnParametersSetAsync();
    }

    protected override void OnAfterRender(bool firstRender)
    {
        logMessage += "OnAfterRender(" + firstRender + ") → ";
        base.OnAfterRender(firstRender);
    }

    protected override Task OnAfterRenderAsync(bool firstRender)
    {
        logMessage += "OnAfterRenderAsync(" + firstRender + ") → ";
        return base.OnAfterRenderAsync(firstRender);
    }

    protected override bool ShouldRender()
    {
        logMessage += "ShouldRender → ";
        return base.ShouldRender();
    }

}

결과

이 상태에서 버튼을 클릭하게되면 Render 관련 이벤트가 처리됩니다.

 

로그 순서

SetParametersAsync(ParameterView parameters)
→ OnInitialized
→ OnInitializedAsync
→ OnParametersSet
→ OnParametersSetAsync
→ (버튼클릭)
→ OnAfterRender(True)
→ OnAfterRenderAsync(True)
→ ShouldRender

 

참고

https://learn.microsoft.com/ko-kr/aspnet/core/blazor/components/lifecycle?view=aspnetcore-7.0

ASP.NET Core Razor 구성 요소 수명 주기