在Blazor中,可以使用EventCallback
和EventCallback
来实现组件之间的属性绑定。下面是一个示例,展示了如何在一个组件中更改服务属性,并在另一个组件中绑定到该属性:
// 服务类
public class DataService
{
public event Action OnDataChange;
private string data;
public string Data
{
get => data;
set
{
data = value;
OnDataChange?.Invoke();
}
}
}
// 组件1
@inject DataService dataService
组件1 - 数据: @dataService.Data
@code {
private async Task ChangeData()
{
dataService.Data = "新数据";
}
}
// 组件2
@inject DataService dataService
组件2 - 数据: @dataService.Data
@code {
private string data;
protected override Task OnInitializedAsync()
{
dataService.OnDataChange += OnDataChange;
return base.OnInitializedAsync();
}
private void OnDataChange()
{
data = dataService.Data;
StateHasChanged();
}
public void Dispose()
{
dataService.OnDataChange -= OnDataChange;
}
}
在上述示例中,我们创建了一个DataService
类,其中包含一个Data
属性和一个OnDataChange
事件。当Data
属性更改时,我们会触发OnDataChange
事件。
在组件1中,我们通过注入DataService
来获取对服务的引用。当用户点击“更改数据”按钮时,我们会调用ChangeData
方法,并将Data
属性设置为新的值。这将触发OnDataChange
事件,并通知所有订阅者数据已更改。
在组件2中,我们也注入了DataService
,并在OnInitializedAsync
方法中订阅了OnDataChange
事件。当数据更改时,我们会更新组件2中的data
字段,并调用StateHasChanged
方法来通知Blazor重新渲染组件。
通过这种方式,我们可以实现组件之间的属性绑定,使一个组件能够监听另一个组件中属性的更改。