c# - 使用父级从组件 Blazor 调用方法

Question

我的组件中有一个名为 ClearFiles(string PathName) 的方法，当前我通过单击组件上的一个按钮来调用该方法，但现在我试图立即调用它们，但我不知道该怎么做这。从组件调用单个 ClearFiles 方法效果很好，但我不太确定如何使用父类一次调用所有这些方法。我在父类中创建了一个名为 ForceClean 的按钮，我希望按下该按钮可以调用所有组件的清除文件功能。

我在 PageFileCleaner.razor 文件中使用 for 循环在父类中创建组件，如下所示:

@foreach (var d in filters)
{
     <CompFileFilter FileFilter="d" OnDelete="Delete" ></CompFileFilter>
}

其中filters是FileFilter类型的列表，位于命名空间Common.DB中。这是在父类中声明的方式:

private List<FileFilter> filters { get; set; }

并使用我的数据库中的数据填充:

        using var context = _db.CreateDbContext();
        filters = await context.FileFilters.AsNoTracking().ToListAsync();
        foreach( var filter in filters)
        {
            FileFilter f = new FileFilter();
        }

这个参数(在子类中)是我使用 FileFilter.Pathname 或 FileFilter.ID 从数据库中的该行获取值的参数，例如:

    [Parameter]
    public FileFilter FileFilter { get; set; }

数据库/文件过滤器对象类:

namespace Common.DB
{
    public class FileFilter
    {
        [Key]
        public int ID { get; set; }
        public string TimerChoice { get; set; }
        public bool IsLoading;
        public string PathName { get; set; } = "";
        public string Extension { get; set; }
        //public string[] extensionList { get; set; }
       ...
    }
}

清除文件功能位于我的组件/子 CompFileFilter.razor 文件中(删除了本示例的代码，因为它有一百多行代码)。我正在父类中创建组件，每个组件都将具有此 ClearFiles() 方法。

public async Task ClearFiles(string PathName)
{  
     filtering code... 
} 

如何从父类循环访问我的组件并调用所有 ClearFiles() 方法？

Answer 1

您可以使用字典并存储每个 CompFileFilter 组件的引用。然后使用引用调用 ClearFiles 方法。您可以使用 FileFilter 的 ID 属性作为字典键。

PageFileCleaner.razor

@foreach (var d in filters)
{
    <CompFileFilter @key="d.ID" @ref="_fileFilterRefs[d.ID]" FileFilter="d" OnDelete="Delete"></CompFileFilter>
}

@code {
    private Dictionary<int, CompFileFilter> _fileFilterRefs = new Dictionary<int, CompFileFilter>();

    private async Task ForceClean()
    {
        // Execute ClearFiles one at a time.
        foreach (var item in _fileFilterRefs)
        {
            await item.Value.ClearFiles();
        }
        
        // Or execute them in parallel.
        //var tasks = _fileFilterRefs.Select(item => Task.Run(item.Value.ClearFiles));
        //await Task.WhenAll(tasks);
    }
}

ClearFiles 方法不需要 PathName 参数。您可以从 FileFilter 参数获取 PathName。

CompFileFilter.razor

@code {
    [Parameter]
    public FileFilter FileFilter { get; set; }

    public async Task ClearFiles()
    {  
        var pathName = FileFilter.PathName;
        // filtering code... 
    } 
}

编辑:

每当您从 filters 列表中删除项目时，您都应该手动更新 _fileFilterRefs 字典，以保持它们同步。例如

private void Delete(FileFilter fileFilter)
{
    _filters.Remove(fileFilter);

    _fileFilterRefs.Remove(fileFilter.ID);
}

每当您将 filters 列表设置为新列表时，都应该清除 _fileFilterRefs 字典。例如

private async Task RefreshFilters()
{
    _fileFilterRefs.Clear();

    _filters = await filterService.GetFileFilters();
}

但是，当您将新项目添加到 filters 列表时，您不必执行相同的操作 (_filters.Add(...) )。在这种情况下，它会自动处理。

总结:

• filters.Add(new FileFilter()) -> 不执行任何操作。
• filters.Remove(fileFilter) -> 从中删除 fileFilter.ID 键 _fileFilterRefs
• filters = new List() -> 在设置列表之前清除 _fileFilterRefs

https://github.com/dotnet/aspnetcore/issues/17361#issuecomment-558138782