扩展方法在输入框失焦前触发致表格自动排序问题求助

1. 缓存扩展方法结果，避免重复执行 #

问题核心是每次UI渲染都会调用ExtensionMethod()，既浪费性能又会因为返回集合的顺序变动导致表格乱跳。可以把计算结果缓存起来，只在数据源list变化时重新计算：

private Dictionary<List<YourObjectType>, bool> _cachedResult;
[Parameter] public List<YourObjectType> list { get; set; }
private List<YourObjectType> _previousList;

protected override void OnParametersSet()
{
    // 仅当数据源list发生变化时，重新执行扩展方法并缓存结果
    if (_cachedResult == null || !ReferenceEquals(list, _previousList))
    {
        _cachedResult = list.ExtensionMethod();
        _previousList = list;
    }
}

之后循环遍历缓存的结果：

@foreach(var dic in _cachedResult) {
    <InputDate ... />
    <InputText ... />
}

2. 改用有序集合替代Dictionary #

Dictionary本身不保证遍历顺序的稳定性（即使.NET Core 3.0+保留插入顺序，若扩展方法每次生成的键顺序变动，依然会导致表格项乱跳）。建议修改扩展方法返回有序集合，比如List<KeyValuePair<...>>并指定明确排序规则：

public static List<KeyValuePair<List<YourObjectType>, bool>> ExtensionMethod(this List<YourObjectType> source)
{
    // 原逻辑生成Dictionary后，按子对象的指定值排序
    var rawResult = // 原有Dictionary生成逻辑
    return rawResult.OrderBy(kv => kv.Key.YourSortProperty).ToList();
}

再配合上面的缓存逻辑，就能保证遍历顺序始终稳定。

3. 降低输入组件的渲染触发频率 #

用户输入时每打一个字就触发渲染，是频繁调用扩展方法的直接诱因。可以用@bind-value:after（Blazor 6+支持）或延迟绑定的方式减少渲染次数：

<InputText @bind-value="@currentInput" @bind-value:after="UpdateSourceDelayed" />

@code {
    private string currentInput;
    private async Task UpdateSourceDelayed()
    {
        // 延迟300毫秒再更新数据源，避免高频渲染
        await Task.Delay(300);
        // 此处更新list中对应对象的属性值
    }
}

内容的提问来源于stack exchange，提问作者Garrett London