主页 / coding / 问题 / 79074107
Accepted
apanay22
Asked: 2024-10-10 19:09:07 +0800 CST

Blazor 继承和代码隐藏结构

  • 772

我想将 Blazor 组件的逻辑保留在代码隐藏文件（即 .razor.cs）中，并且只在 .razor 文件中包含 UI 标记。为了实现这一点，我创建了一个包含一些共享逻辑的基类（CustomBasePage）。

在代码隐藏 (.razor.cs) 中，我想从此 CustomBasePage 继承。但是，我收到错误：

“CustomerDetails”的部分声明不能指定不同的基类。

以下是我目前所做的：

在 CustomerDetails.razor 文件中，我删除了所有 @inherits 指令，因此只保留标记。在 CustomerDetails.razor.cs 文件中，我让 CustomerDetails 类继承自 CustomBasePage。尽管如此，我仍然收到错误。我尝试清理解决方案，确保 .razor 文件中没有 @inherits 指令，甚至检查了其他可能存在冲突的部分类声明。

这是CustomerPage.razor.cs的代码：

    public partial class CustomerDetails : BasePage {
    ...
        protected override async Task OnInitializedAsync(){
SetMenu()//I want to call the function from the basePage.. PROBLEM
} 

    }

对于 CustomerPage.razor 我没有继承任何东西

对于 BasePage 我有以下代码：

public class BasePage : ComponentBase
{
    [Inject] private IJSRuntime JSRuntime { get; set; }
    [Inject] private AppStateService AppState { get; set; }
    [Inject] private IMenuManager _menuManager { get; set; }
    [Inject] private NavigationManager NavigationManager { get; set; }

    protected new void StateHasChanged() => base.StateHasChanged();

    protected async Task SetMenu()
    {
        Console.WriteLine("PAGE INITIALIAZE");

        //Implementation
        await Task.CompletedTask;
    }
}

我需要在后面的代码中访问 SetMenu

blazor

2 个回答

  1. Blazor 组件默认派生自ComponentBase：

    Razor 组件被编译为从 ComponentBase 派生的 C# 类。https ://www.learnblazor.com/components

    因此，该CustomerDetails.razor文件被编译成如下内容：

    public partial class CustomerDetails : ComponentBase
{
   ...
}

    另一方面，隐藏代码CustomerDetails.razor.cs与razor文件的继承相冲突：

    public partial class CustomerDetails : BasePage 
{
  ...
}

    结论

    • 您必须在文件中定义继承CustomerDetails.razor。
    
@page "/customer/{id}"
@inherits BasePage

<div>
@Id
</div>
    • 我认为在代码隐藏中继承CustomerDatails.razor.cs是没有必要的。
    • 0
  2. Best Answer

    我已删除所有@inherits 指令，以便仅存在标记。

    当您这样做时，Blazor 将默认从 ComponentBase 类继承。

    在两个文件中指定相同的基类，或者仅使用@inherits。在你的情况下：

    客户页面.razor：

     @inherits BasePage

    客户页面.razor.cs：

    public partial class CustomerPage {
   ...
}
    • 0

相关问题