Привязка в Blazor с базовыми и производными классами

#c# #model-view-controller #design-patterns #.net-core #blazor

#c# #модель-представление-контроллер #шаблоны проектирования #.net-ядро #blazor

Вопрос:

Я пытался придумать лучший способ сделать это, и я не могу придумать то, что я считаю подходящим решением. По сути, у меня есть следующее:

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

Теперь на моей странице у меня есть привязки, которые всегда будут встречаться в базовом классе, НО есть сценарии, в которых на странице есть привязки для производных объектов. Этот базовый класс также является параметром для загрузки страницы на данный момент, поэтому я не слишком уверен в наилучшем подходе здесь. Это будет выглядеть примерно так, как показано ниже.

 [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;}
}
  

Комментарии:

1. Потрясающе! Именно то, что я искал, большое вам спасибо! Я обязательно попробую это 🙂