在Blazor中,可以通过使用参数和事件来在组件之间传递List
首先,创建一个名为“DataList”的组件,该组件接受一个List
@typeparam T
@foreach (var item in Items)
{
- @item.ToString()
}
@code {
[Parameter]
public List Items { get; set; }
}
然后,在父组件中使用DataList组件,并通过参数将List
@page "/parent"
Parent Component
@code {
List myList = new List { "Item 1", "Item 2", "Item 3" };
}
现在,DataList组件将在父组件中显示传递的List
如果要在子组件中修改List
首先,在DataList组件中添加一个事件,当列表项被点击时触发:
@typeparam T
@foreach (var item in Items)
{
- OnItemClick(item))">@item.ToString()
}
@code {
[Parameter]
public List Items { get; set; }
[Parameter]
public EventCallback ItemClick { get; set; }
private async Task OnItemClick(T item)
{
await ItemClick.InvokeAsync(item);
}
}
然后,在父组件中处理ItemClicked事件,并在事件处理程序中更新List
@page "/parent"
Parent Component
@code {
List myList = new List { "Item 1", "Item 2", "Item 3" };
private void OnItemClick(string item)
{
myList.Remove(item);
}
}
现在,当在DataList组件中点击列表项时,它将从父组件的List