.NET Blazor使用子组件中的处理程序方法进行双向数据绑定

@* Components\Pages\Home.razor *@
@page "/"
@rendermode InteractiveServer

<h4>Home component</h4>
<input type="number" @bind:get="age" @bind:set="SetAge" />
<h2>Age: @age</h2>

@code {
  int age = 18;

  void SetAge(int value)
  {
    if (value > 0 && value < 110)
      age = value;
  }
}

@* Components\Pages\Home.razor *@
@page "/"
@rendermode InteractiveServer

<h4>Home component</h4>
<About Age="age" @oninput="@SetAge" />

@code {
  int age = 5;

  void SetAge(int value)
  {
    if (value > 0 && value < 110)
      age = value;
  }
}

@* Components\Pages\About.razor *@
<h4>About component</h4>

<input type="number" @bind:get="Age" @bind:set="SetAge" />
<h2>Age: @Age</h2>

@code {
  [Parameter]
  public int Age { get; set; } = 18;

  [Parameter]
  public EventCallback<string> InputChanged { get; set; }
}

@* Components\Pages\Home.razor *@
@page "/"
@rendermode InteractiveServer

<h4>Home component</h4>
<About @bind-Age="age"  />

@code {
  private int age = 5;
}

@* Components\Pages\About.razor *@
<h4>About component</h4>

<input type="number" @bind:get="Age" @bind:set="OnAgeChanged" />
<h2>Age: @Age</h2>

@code {
  [Parameter]
  public int Age { get; set; }

  [Parameter]
  public EventCallback<int> AgeChanged { get; set; }

  private async Task OnAgeChanged(int value)
  {
    if (value > 0 && value < 110)
      Age = value;

    await AgeChanged.InvokeAsync(Age);
  }
}

.net相关问答推荐

WinForm Task.Wait ：为什么它会阻塞 UI？

在 Rx 中，处理线程安全是否是消费者(IObserver)的责任？

在接口内部声明 IEnumerable 而在具体类中声明 IList

NonSerialized 属性

如何摆脱 VS2008 中的目标程序集不包含服务类型错误消息？

为什么 .Contains 慢？通过主键获取多个实体的最有效方法？

是否可以像 WebView 一样在 Windows 窗体中嵌入 Gecko 或 Webkit？

在 .NET C# 中存储加密密钥的最佳方式

ILMerge 最佳实践

我可以使用 UriTemplate 将非字符串传递给 WCF RESTful 服务吗？

如何在 C# 中创建 Word 文档？

C#：内存不足异常

使用多个 MemoryCache 实例

String 是原始类型吗？

在 C# 中转义命令行参数

.NET 如何判断路径是否是文件而不是目录？

.net 自定义配置如何不区分大小写解析枚举 ConfigurationProperty

.NET 中是否有可序列化的通用键/值对类？

Visual Studio 类图不显示关系

System.ServiceModel 在 .NET Core 项目中找不到