首页 > 解决方案 > Blazor:有一个子组件更新其父模型的属性

问题描述

我正在寻找一种编辑类/模型实例的参数的方法,该参数从该父级的子级持续存在于父级中。

我有一个组件可以处理字符串的编辑,这些字符串通常是较大模型的一部分。

假设我有这些模型:

 public class Customer
{
    public string FirstName;
    public string LastName;
}
public class Arena
{
    public string Name;
    public string Location;
}

我的父组件看起来像这样:.cs 部分(名为:Parent.razor.cs):

public partial class Paren : ComponentBase
{
    public Arena myArena;
    public Customer myCustomer;
    protected override async Task OnInitializedAsync()
    {
        myArena = new Arena() { Location = "Centrum", Name = "TheBigGlobe" };
        myCustomer = new Customer() { FirstName = "kalle", LastName = "anka" };
    }
}

及其 .razor 部分(命名为:Parent.razor)

<h1>component test</h1>
@if(myArena != null)
{
    //pass paramenter by ref to child
}

如何创建可以将其更改绑定到父级中未知模型的实例和属性的子组件?

例如,如何使我的子组件能够引用 myArena.Name 作为参数,然后在父组件中更新它?请注意,传递给子项的引用可以是来自任何其他类实例的任何其他参数,这一点很重要。

我正在寻找的是一种编辑类/模型实例的参数的方法,该参数从该父级的子级持续存在于父级中。

标签: c#razorblazor

解决方案


您可以轻松地创建一个子组件并传递一个 arena 参数。

 <childComponent arena={myArena}> </childComponent> 

@code { 

   [parameter] public Arena arena {get; set;}
}

如果您想从子组件中获取修改后的数据竞技场,您可以使用 EventCallBack。

这是一篇文章,描述了在两个组件之间进行通信的几种方法。


推荐阅读