当EditForm的Model更改时,列表会更新。怎么预防?

时间:2020-04-09 11:53:35

标签: blazor blazor-client-side

在我的表中,我有一个名为Person的列表操作类型PersonList。单击一行后,类型为Person的另一个对象(模型)被设置为该行的该值,因此我的EditForm被该值更新。到目前为止一切顺利。

但是当我在EditForm中更改te值时,我的列表也会随之更新。

那怎么可能?以及如何装饰它?

非常感谢!

<h3>Component</h3>

<table>
   <thead>
       <tr>
           <th>ID</th>
           <th>Name</th>
           <th>Age</th>
       </tr>
   </thead>
   <tbody>
       @foreach (var person in PersonList)
       {
           <tr @onclick="@(() => ActivateItem(person))">
               <td>@person.Id</td>
               <td>@person.Name</td>
               <td>@person.Age</td>
           </tr>
       }
   </tbody>
</table>

<EditForm Model="Model">
    <InputText @bind-Value="Model.Name" />
    <InputNumber @bind-Value="Model.Age" />
</EditForm>


@code {

    private List<Person> PersonList = new List<Person>();
    private Person Model = new Person();

    private void ActivateItem(Person person)
    {
        Model = person;
    }

    public class Person
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public int Age { get; set; }
    }

    protected override void OnInitialized()
    {
        PersonList.Add(new Person
        {
            Id = 1,
            Name = "Jack",
            Age = 20
        });

        PersonList.Add(new Person
        {
            Id = 2,
            Name = "Paul",
            Age = 25
        });

        PersonList.Add(new Person
        {
            Id = 3,
            Name = "Brad",
            Age = 30
        });
    }
}

1 个答案:

答案 0 :(得分:1)

好吧,这是因为您要保留对对象的引用,而bind-value是一种双向绑定。一点也不奇怪。

一种解决方案是使用一种单向绑定,另一种解决方案是通过实例化一个新对象从对象中删除引用。像这样:

private void ActivateItem(Person person)
    {
        Model = new Person
        {
              Id = person.Id,
              Name = person.Name,
              Age = person.Age
         };
    }