OnParametersSetAsync调用时@ref未初始化？CustomValidation初始化时机咨询

核心问题结论 #

不能依赖OnParametersSetAsync中@ref绑定的组件实例已完成赋值。

原因说明 #

Blazor的组件渲染流程中，@ref绑定的子组件实例是在**组件完成渲染（DOM生成后）**才会被赋值到对应字段。而OnParametersSetAsync的执行时机是参数设置完成后、组件渲染之前，此时子组件还未完成实例化或绑定，首次进入该方法时@ref字段必然为null。你观察到的“执行到中部变为非null”，大概率是异步操作触发了组件二次渲染，此时子组件已初始化完成，@ref字段才被赋值，但这种时机不可靠，不能作为依赖。

正确的初始化时机 #

如果需要操作@ref绑定的子组件，应该在OnAfterRenderAsync方法中执行逻辑。该方法在组件渲染完成（包括子组件实例创建、@ref赋值）后触发。为避免每次渲染重复执行初始化逻辑，可通过firstRender参数判断仅在首次渲染时执行：

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        // 此处CustomValidation实例已确保可用
        await InitializeCustomValidationAsync();
    }
}

private async Task InitializeCustomValidationAsync()
{
    CustomValidation.ClearErrors();

    var user = (await LoggedInUser.GetCombinedUser(Principal))?.IdentityUser;
    if (user == null)
    {
        var errors = new Dictionary<string, List<string>>
        {
            { "user", new List<string> { "请先登录，再确认你的手机号码。" } }
        };
        CustomValidation.DisplayErrors(errors);
        return;
    }
    _identityUserId = user.Id;

    if (!string.IsNullOrEmpty(user.PhoneNumber))
    {
        ConfirmPhoneModel.RawNumber = user.PhoneNumber;
        ConfirmPhoneModel.DisplayNumber = await SmsService.FormatPhoneNumber(user.PhoneNumber);
    }
    else
    {
        ConfirmPhoneModel.DisplayNumber = "{unknown}";
        var errors = new Dictionary<string, List<string>>
        {
            { "user", new List<string> { "请进入用户设置页面绑定你的手机号码。" } }
        };
        CustomValidation.DisplayErrors(errors);
    }
}

补充场景解答 #

场景1：根据登录状态显示不同验证错误 #

如上述代码所示，将错误信息设置逻辑放到OnAfterRenderAsync的首次渲染分支即可，确保CustomValidation实例存在，页面加载时就能正确显示对应错误。

场景2：子组件中根据传入的Context参数设置Value #

不需要在SetParametersAsync中监听，直接在OnParametersSetAsync中处理即可。OnParametersSetAsync会在每次参数（包括Context）更新时自动触发，此时可安全读取Context的最新值并更新Value：

// 子组件代码示例
[Parameter] public EditContext Context { get; set; }

protected override void OnParametersSet()
{
    base.OnParametersSet();
    if (Context?.Model is IIncludesAddressModel addressModel)
    {
        Value = addressModel.AddressModel;
    }
}

若需更精细控制（比如仅在Context.Model变化时更新），可维护旧值字段对比后执行：

private object _previousModel;

protected override void OnParametersSet()
{
    base.OnParametersSet();
    if (Context?.Model != _previousModel && Context?.Model is IIncludesAddressModel addressModel)
    {
        Value = addressModel.AddressModel;
        _previousModel = Context.Model;
    }
}

相关代码参考 #

父组件Razor代码 #

<EditForm Model="@ConfirmPhoneModel" OnValidSubmit="HandleValidSubmitAsync" Context="EditFormContext">
    <DataAnnotationsValidator/>
    <CustomValidation @ref="CustomValidation" />
</EditForm>

父组件后台代码 #

public CustomValidation? CustomValidation { get; private set; }

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