728x90
728x170

부모에 선언된 Parmeter 를 전달받아서 사용하는 것으로 CascadingValue 의 Value 로 값을 넣고 태그 안에 Child 항목을 넣게 되면 Child 항목은 CascadingParameter 을 선언하여 부모에 선언된 값을 받아서 처리할수 있게됩니다.

CascadingTest.razor

@page "/cascadingtest"
<h3>CascadingTest</h3>

<h3>CascadingParent</h3>
@if (stringData != null)
{
    foreach (string example in stringData)
    {
       <h1>@example</h1>
    }
}

<CascadingValue Value="@stringData">
    <CascadingChild />
</CascadingValue>

@code {
    private List<string>? stringData = new() { "Item 1", "Item 2" };
}

CascadingChild.razor

<h3>CascadingChild</h3>

@if (ExampleList != null)
{
    foreach (string example in ExampleList)
    {
        <h2>@example</h2>
    }
}

@code {

    [CascadingParameter]
    protected IEnumerable<string>? ExampleList { get; set; }
}

아래 결과를 보면 알수 있듯이 자식요소에서는 값을 셋팅하지 않고도 부모가 정의한 값을 받아 처리할수 있습니다.

[Source]
https://github.com/kei-soft/Blazor.AppTest/tree/master/Blazor.MSDocTest

 

GitHub - kei-soft/Blazor.AppTest

Contribute to kei-soft/Blazor.AppTest development by creating an account on GitHub.

github.com

 

728x90
그리드형

'C# > Blazor' 카테고리의 다른 글

[Blazor] CascadingParameter 의 Name 사용  (1) 2022.12.26
[Blazor] Multiple CascadingParameter  (0) 2022.12.26
[Blazor] StateHasChanged  (0) 2022.12.26
[Blazor] RenderFragment 사용하기  (0) 2022.12.26
[Blazor] ComponentBase 사용하기 - inherits  (0) 2022.12.26
Posted by kjun.kr
,