Blazor继承自定义组件通信异常问题求助

问题根源 #

你的DerivedComponent存在核心错误：既通过@inherits BaseComponent继承了基类，又在视图中实例化了全新的<BaseComponent />。这会生成两个完全独立的组件实例：

• 页面传递的Text、@bind-Value参数仅作用于DerivedComponent自身（继承自BaseComponent的实例）
• 视图中的<BaseComponent />是无关联的新实例，参数都是默认值，且ValueChanged回调未绑定到页面逻辑
• 点击按钮时触发的是内部<BaseComponent />的逻辑，和页面绑定的DerivedComponent实例完全脱节，导致通信失效

修复方案 #

移除视图中的<BaseComponent />标签，通过@base.BuildRenderTree(__builder)复用基类的UI逻辑，确保使用的是DerivedComponent自身继承的参数和回调。

修正后的DerivedComponent代码 #

@using System.Diagnostics
@inherits BaseComponent;
<div style="color: @Color;">
    Derived:<br/> 
    @base.BuildRenderTree(__builder)
</div>

@code {
    [Parameter] public string Color { get; set; } = "red";

    protected override void OnParametersSet()
    {
        base.OnParametersSet();

        Debug.WriteLine($"Text: {Text}");
        Debug.WriteLine($"Value: {Value}");
    }
}

验证效果 #

修改后：

1. 页面传递的Value="1000"会正确显示在基类的输入框中
2. 点击按钮时，Callback方法修改的是DerivedComponent继承的Value，触发的ValueChanged会同步更新页面的_parentChildText
3. 点击「Dump Values」按钮可以看到最新的_parentChildText值

内容的提问来源于stack exchange，提问作者tdinpsp