在 Blazor 中使用基类和派生类绑定

Posted 2023-03-31

【中文标题】在 Blazor 中使用基类和派生类绑定

【英文标题】：Binding in Blazor with Base & Derived classes

【发布时间】：2021-01-03 18:18:11

【问题描述】：

我一直在想最好的方法来做到这一点，但我想不出我认为合适的解决方案。基本上我有以下几点：

Base Class Animal
Derived Class Dog : Animal
Derived Class Bird : Animal

现在在我的页面上，我的绑定总是会出现在基类中，但是在某些情况下，页面上有派生对象的绑定。这个 Base 类也是目前要加载的页面的参数，所以我不太确定这里的最佳方法。它看起来像下面的东西。

[Parameter] Animal Animal get; set;

然后在页面上我像这样进行绑定：

<input text=@bind-Value=@Animal.Name/>

我的问题是，如果抓取的基类是派生类的类型，我将如何添加它以便映射派生对象的属性？

如果动物是鸟的话，我也可以像这样绑定属性：

public class Animal

     public string Name get; set; 


public class Bird : Animal

     public string Wing get; set; 

<input text=@bind-Value=@Animal.Name/>
<input text=@bind-Value=@Animal.Wing/>

这样的事情是可能的还是我没有适当地组织我的课程？任何见解将不胜感激。

【参考方案1】：

我也遇到过同样的问题，我通过为每个派生类型创建一个组件和一个 switch 语句来解决它：

public abstract class Animal

     public abstract string KindName  get; 
     public string Name  get; set;  


public class Bird : Animal

     public override string KindName => "Bird";
     public string Wing get; set; 

AnimalComponent.cs

public abstract class AnimalComponent<T> where T: Animal

     [CascadingParameter]
     public T Animal get; set; 

Bird.razor

@inherits AnimalComponent<Bird>

<input text=@bind-Value=@Animal.Wing/>

AnimalPage.razor

<CascadingValue Value="Animal">
    <input text=@bind-Value=@Animal.Name/>
    @switch (Animal.KindName)
    
       case "Bird":
          <Bird />
          break;
       ...
    
</CascadingValue>
@code 
    [Parameter] Animal Animal get; set;

【讨论】：

太棒了！正是我要找的，非常感谢！我一定会试试这个:)