更改查询字符串值时未调用 OnInitializedAsync 方法

Question

我正在开发 Blazor 服务器端应用程序，并且有一个绑定动态菜单的标头。还有一个类别页面，我在其中显示基于已绑定在标题菜单中的查询字符串的数据。

一旦我选择菜单并且类别页面显示代表查询字符串值的数据，OnInitializedAsync 方法就会被调用，但我再次打开菜单并选择不同的产品，然后类别页面不会被调用。

下面是标题菜单的代码。

Header.razor（这是在主布局页面上注册的）

<ul class="cat_menu">
    @if (categoryDtos == null)
    {
         <div>Loading...</div>
    }
    else
    {
         @foreach (var category in categoryDtos)
         {
          <li><a href="category/@category.Id">@category.Name<i class="fas fa-chevron-right"></i></a></li>
          }
   }
</ul>

 public class HeaderBase : ComponentBase
{
    [Inject] public IToastService toastService { get; set; }

    [Inject] ICategoryService categoryService { get; set; }

    public List<CategoryDto> categoryDtos { get; set; }

    protected async override Task OnInitializedAsync()
    {
        var categoryLIst = await categoryService.GetCategories();

        if (categoryLIst.Data != null)
        {
            categoryDtos = categoryLIst.Data.ToList();
            toastService.ShowSuccess("Fetch successfully");
        }
        else
        {
            toastService.ShowError(categoryLIst.Message);
        }
    }

    
}

产品.razor 页面

 @page "/category/{categoryID}"

   <ul class="sidebar_categories">

                        @if (categoryTypeDtos == null)
                        {
                            <div>Loading...</div>
                        }
                        else
                        {
                            @foreach (var category in categoryTypeDtos)
                            {
                                <li><a href="#">@category.Name</a></li>
                            }
                        }
                    </ul>

 public class CategoryBase : ComponentBase
{
    [Inject] public IToastService toastService { get; set; }
    [Parameter] public string categoryID { get; set; }

    [Inject] ICategoryService categoryService { get; set; }

    public List<CategoryTypeDto> categoryTypeDtos { get; set; }

    protected async override Task OnInitializedAsync()
    {

        var response = await categoryService.GetCategoryTypeByID(Guid.Parse(categoryID));
        if (response.Data != null)
        {
            categoryTypeDtos = response.Data.ToList();
            toastService.ShowSuccess("Fetch successfully");
        }
        else
        {
            toastService.ShowError(response.Message);
        }
    }
}

Answer 1

OnInitialized 仅在首次创建组件或页面时调用。

呈现相同组件的新 url 将使用该实例。您需要 OnParametersSetAsync 相反。