You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Blazor子组件参数传递官方文档是否正确?多场景适配探讨

Blazor组件参数同步问题

官方初始代码的局限

官方给出的子组件初始代码如下:

private bool expanded;

[Parameter]
public bool Expanded { get; set; }

protected override void OnInitialized()
{
    expanded = Expanded;
}

这段代码仅能应对基础场景——当父组件通过“展开全部”这类操作主动修改子组件的Expanded参数时,由于OnInitialized生命周期方法仅执行一次,子组件的本地expanded变量无法同步更新,导致状态不一致。

我的改造实现

为了解决上述问题,我对代码做了以下调整:

  1. 将自动属性改为带私有字段的属性
  2. 把参数赋值逻辑从OnInitialized移至属性的setter中
  3. 添加ExpandedChanged回调事件,实现子组件状态向父组件同步

最终代码如下:

private bool expandedLocal;   
private bool _expandedBackingField;

[Parameter]
public EventCallback<bool> ExpandedChanged { get; set; }

[Parameter]
public bool Expanded
{
    get => _expandedBackingField;
    set
    {
        if (_expandedBackingField == value)
            return;

        _expandedBackingField = value;
        expandedLocal = Expanded;
    }
}

private void Toggle()
{
    expandedLocal = !expandedLocal;
    ExpandedChanged.InvokeAsync(expandedLocal);
}

疑问

  • 我的实现方案与官方方案哪个是正确的?
  • 当前代码是否过于复杂?有没有遗漏官方文档中的关键要点?

补充说明

我希望遵循官方开发指南,同时让组件支持以下灵活场景:

  • 父组件通过常量传递参数
  • 父组件主动修改参数值
  • 父子组件间的双向绑定

内容的提问来源于stack exchange,提问作者greenoldman

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.30 05:39:55