Блог

У меня есть модель, которая отлично привязана к элементам управления формой и более или менее выполняет то, что ей говорят (программное обеспечение-отличное начало).

Модель данных довольно ванильная:

 public class Enrolment
{
    public string Id { get; set; }
    public Parent[] Parents { get; set; }
    public Child[] Children { get; set; }
    ...
}

public class Parent
{
    public string FamilyName { get; set; }
    public string FirstName { get; set; }
    public string Email { get; set; }
    public string Phone { get; set; }
}
 

Когда я нажимаю кнопку на своей форме верхнего уровня «Регистрация.razor» (форма «родитель», но если я начну слишком много говорить о родителях и детях, это может привести к путанице), я добавляю еще одного родителя в массив родителей []. Учитывая, что я, возможно, захочу добавить от 1 до 4 родителей, я решил, что сделаю компонент для обработки этой части формы:

     @foreach(Parent parent in newEnrolment.Parents){
        <Caregiver RegisteredParent=parent OnEdit=CaregiverEdit />
    }
 

Компонент «Воспитатель» выглядит следующим образом:

 <div className="row">
    <div className="column">
        <label htmlFor="lastName">Last name</label>
        <input type="text" placeholder="Last name" id="lastName" @bind=RegisteredParent.FamilyName />
    </div>
    <div className="column">
        <label htmlFor="firstName">Name</label>
        <input type="text" placeholder="First name" @bind=RegisteredParent.FirstName id="firstName" />
    </div>
    <div className="column">
        <label htmlFor="email">Email</label>
        <input type="text" placeholder="Email" id="email" @bind=RegisteredParent.Email />
    </div>
</div>
<button type="button" @onclick="OnSaveClick">Save</button>

@code {
    [Parameter]
    public Parent RegisteredParent { get; set; }

    [Parameter]
    public EventCallback<Parent> OnEdit { get; set; }


    private async Task OnSaveClick(MouseEventArgs e)
    {
        Console.WriteLine($"Saved {RegisteredParent.FirstName} {RegisteredParent.FamilyName}.");
        await OnEdit.InvokeAsync(RegisteredParent);
    }

}
 

В идеале я хотел бы обновить выбранную родительскую запись в событии onchange, а не нажимать кнопку, чтобы вызвать там метод onEdit. Как я могу этого достичь?

Я не вижу здесь Службы, поэтому я предполагаю, что ее нет.

Ваши данные должны храниться в сервисе. Вероятно, в этом случае область действия ограничена, но без общей картины?? Давайте назовем это EnrolmentService .

 // pseudocode
class EnrolmentService 
{

private List<dataitem> datalist {get; set;}

public Event EventHandler ListUpdated;

public dataitem GetRecord(id) .....

public bool AddRecord(dataitem) 
{
  trigger ListUpdated
 ....
}

blah, blah,...
}
 

Затем вы можете добавить некоторые методы CRUD в службу для взаимодействия с набором данных.

Затем вы можете получить доступ к службе через DI [внедрение зависимостей]

 [Inject]private EnrolmentService DataService {get; set;}
 

Таким образом, и ваш редактор, и средство просмотра списков получают доступ к одним и тем же данным в одной и той же службе.

В сервисе есть публичное событие, что-то вроде OnListUpdated того, что вы запускаете каждый раз, когда добавляете/редактируете значение в своем редакторе. Затем вы можете подключить компонент списка к событию и обновить его представление, когда что-то изменится.

В общем, пытаться соединить компоненты вместе-не очень хорошая идея.