как я могу сослаться на компонент, созданный с помощью DynamicComponent в Blazor?

Я визуализирую компоненты с помощью DinamicComponent, и мне нужно вызвать функцию, найденную в дочернем компоненте. Я не могу найти эквивалент использования @ref для DinamicComponents, чтобы я мог ссылаться на вызов функции.

Это родительский компонент

       <div class="tab-content">
            @foreach (VerticalTabComponent.TabModel oneTabItem in VerticalTabsList)
            {
                <div class="tab-pane fade show @(oneTabItem.TabIndex == SelectedTabIndex ? "active" : "")" @key=@($"VTabDivDynamic_{TabPrefix}_{oneTabItem.TabIndex.ToString()}")>
                    <DynamicComponent
                              Type=@System.Type.GetType(oneTabItem.TabComponent)
                              Parameters=@oneTabItem.TabParameters>
                    </DynamicComponent>
                </div>
            }
        </div>

Это код на вкладке компонентов Blazor

       public partial class TabComponent
{
    [Parameter]
    public EventCallback<string> InsertUpdateCallback { get; set; }

    
    protected override async Task OnInitializedAsync()
    {
       await CallAnyfunctionAsync();
    }
    private async Task<bool> LoadDataGrid()
    {
       //this is the function I need to call from parent
    }
}

Как я могу вызвать функцию Load Grid из родительского компонента?

2 ответа

Есть простое решение. Не уверен, что это ново, но атрибут ref для DynamicComponent существует! Вы можете использовать его следующим образом:

      <DynamicComponent Type="typeof(MyComponent)" Parameters="@MyParameters" @ref="dc" />

и в коде программной части:

      private DynamicComponent? dc;

private MyComponent? MyComponentRef
{
    get
    {
        return (MyComponent?)dc?.Instance;
    }
}

Обычно в Blazor мы используем @Ref чтобы получить ссылку на компонент, но, как вы видели, это не сработает с DynamicComponent.

Обходной путь для этого - добавить [Parameter]к компоненту, который называется чем-то вроде which, является действием с универсальным типом, установленным в качестве типа компонента. Затем вы можете добавить код для обработки OnParametersSet для вызова этого метода в компоненте.

Затем вы можете добавить параметр в свой TabParameters который обновляется со ссылкой.

Пример кода ниже будет добавлен в SurveyPrompt составная часть:

          /// <summary>
    ///  will be called when params set
    /// </summary>
    [Parameter] public  Action<SurveyPrompt> Register { get; set; }

    protected override void OnParametersSet()
    {
        if (Register != null)
        {
            // register this component
                Register(this);
        }
    }

Вы добавляете Register параметр с Action<type>значение. Вот пример:

          SurveyPrompt sp1 = null;


    void Register1(SurveyPrompt survey)
    {
        sp1 = survey;
        Console.WriteLine("SP1 has title " + sp1.Title);
    }

    protected override void OnInitialized()
    {
        Action<SurveyPrompt> p1 = Register1;

        params1 = new Dictionary<string, object>()
        {
            { "Title", "Survey Title Here" },
            { "Register", p1 }
        };
    }

    IDictionary<string, object> params1;

Другие вопросы по тегам