如何确保Blazor组件UserClaims执行完毕后再触发Dashboard的OnInitializedAsync？

下面是几种可行的实现方式，可根据你的业务场景选择：

方法1：通过事件回调通知父组件 #

让子组件在完成初始化和数据获取后，主动触发事件通知父组件，父组件收到通知后再执行依赖子组件数据的初始化逻辑。

子组件（UserClaims.razor）代码： #

@code {
    // 定义供父组件监听的回调事件
    [Parameter]
    public EventCallback OnInitializedCompleted { get; set; }

    protected override async Task OnInitializedAsync()
    {
        // 执行自身初始化和数据获取逻辑
        await GetClaimsPrincipalData();
        // 通知父组件：自身初始化已完成
        await OnInitializedCompleted.InvokeAsync();
    }

    private async Task GetClaimsPrincipalData()
    {
        // 你的数据获取逻辑，比如从认证状态或后端接口拉取Claims数据
    }
}

父组件（Dashboard.razor）代码： #

<!-- 将子组件的完成事件绑定到父组件的处理方法 -->
<UserClaims OnInitializedCompleted="@RunDashboardCoreInit" />

@code {
    protected override async Task OnInitializedAsync()
    {
        // 这里可以放置不依赖子组件数据的轻量初始化操作
        // 核心的依赖逻辑移到RunDashboardCoreInit中执行
    }

    private async Task RunDashboardCoreInit()
    {
        // 此时可安全使用UserClaims初始化后的基础值
        // 执行原本要在OnInitializedAsync中完成的核心逻辑
    }
}

方法2：用共享状态容器等待加载完成 #

创建一个共享的状态服务，子组件完成数据加载后标记状态为完成，父组件在自身的OnInitializedAsync中等待这个完成信号。

1. 定义状态类： #

public class UserClaimsState
{
    // 用于等待加载完成的信号源
    public TaskCompletionSource<bool> ClaimsLoaded { get; } = new();
    // 存储UserClaims加载完成的数据
    public ClaimsPrincipal? UserClaimsData { get; set; }
}

2. 注册为Scoped服务（Program.cs）： #

builder.Services.AddScoped<UserClaimsState>();

3. 子组件（UserClaims.razor）代码： #

@inject UserClaimsState ClaimsState

@code {
    protected override async Task OnInitializedAsync()
    {
        ClaimsState.UserClaimsData = await GetClaimsPrincipalData();
        // 标记数据加载完成，触发等待的父组件逻辑
        ClaimsState.ClaimsLoaded.SetResult(true);
    }

    private async Task<ClaimsPrincipal> GetClaimsPrincipalData()
    {
        // 数据获取逻辑
    }
}

4. 父组件（Dashboard.razor）代码： #

@inject UserClaimsState ClaimsState

@code {
    protected override async Task OnInitializedAsync()
    {
        // 等待UserClaims完成数据加载
        await ClaimsState.ClaimsLoaded.Task;
        // 此时可直接使用ClaimsState.UserClaimsData
        // 执行后续初始化逻辑
    }
}

方法3：父组件前置获取数据再传递给子组件 #

将原本子组件的GetClaimsPrincipalData逻辑移到父组件，父组件先完成数据获取，再将数据传递给子组件初始化。这种方式天然由父组件控制执行顺序。

父组件（Dashboard.razor）代码： #

@if (_userClaimsData != null)
{
    <!-- 数据准备完成后再渲染子组件 -->
    <UserClaims InitialClaimsData="@_userClaimsData" />
    <!-- 其他依赖数据的页面内容 -->
}

@code {
    private ClaimsPrincipal? _userClaimsData;

    protected override async Task OnInitializedAsync()
    {
        // 先完成数据获取
        _userClaimsData = await GetClaimsPrincipalData();
        // 数据获取完成后组件自动重渲染，加载子组件并执行后续逻辑
    }

    private async Task<ClaimsPrincipal> GetClaimsPrincipalData()
    {
        // 原本UserClaims中的数据获取逻辑迁移到这里
    }
}

子组件（UserClaims.razor）代码： #

[Parameter]
public ClaimsPrincipal InitialClaimsData { get; set; } = default!;

@code {
    protected override void OnInitialized()
    {
        // 直接使用父组件传入的数据完成初始化，无需异步请求
    }
}

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