Blazor Wasm - 如何从继承的组件更新基础组件？

Question

我有一个包含两个组件的 Blazor Wasm 应用程序：

BaseComp.razor:

<h1>I'm base - @Text</h1>

@code{
    protected string Text {get; set;} = "Default";
}

子组件.razor

@inherits BaseComp

<BaseComp/>

<h1>Hello, only child text!</h1>

@code {
    protected override void OnInitialized()
    {
        Text = "new";
    }
}

并在页面上显示以下内容：

I'm base - Default
Hello, only child text!

如何从 childComponent 更新 baseComponent 的 Text 属性？

Answer 1

有了这段代码

@inherits BaseComp
<BaseComp/>  @* a new instance, not inheritance *@

你继承自和与 BaseComp 组合。您没有使用继承部分。

因此，仅使用组合并按照@MarvinKlein 的答案进行操作，但删除@inherits 行。

或者将代码更改为：

@inherits BaseComp

@*<BaseComp />*@
@{ base.BuildRenderTree(__builder); }

Answer 2

您需要将其声明为参数并将值传递下去。

BaseComp.razor:

<h1>I'm base - @Text</h1>

@code{
   [Parameter] public string Text {get; set;} = "Default";
}

ChildComponent.razor

@inherits BaseComp

<BaseComp Text="Text"/>

<h1>Hello, only child text!</h1>

@code {
    protected override void OnInitialized()
    {
        Text = "new";
    }
}