Blazor中select用@bind切换选项时为何触发GetSelectedVariant调用

• Blazor组件默认重渲染规则：使用@bind指令将select元素绑定到currentTypeId字段时，切换下拉选项会更新currentTypeId的值，绑定值变更会自动触发当前组件的重渲染流程——组件会重新执行Razor模板中所有嵌入的C#表达式、方法调用，对比新旧DOM差异后更新页面。
• 代码实现逻辑问题：现有代码未缓存GetSelectedVariant()的返回结果，而是在渲染逻辑中直接多次调用该方法。统计现有代码中的调用位置：判断选中变体是否为空调用1次、对比原价与售价时分别取两个价格调用2次、渲染原价时调用1次、渲染售价时调用1次，单次组件渲染就会执行5次GetSelectedVariant()，切换选项触发重渲染时，自然会观察到该方法被反复执行。

• 避免在渲染模板中直接重复调用计算类方法，将计算结果缓存为组件字段，渲染时直接读取字段值，减少无意义的重复执行。
• 参考实现调整：
  1. 新增专用字段存储当前选中的商品变体
  2. 将currentTypeId改为带变更逻辑的属性，值更新时同步计算对应的选中变体
  3. Razor模板中替换所有GetSelectedVariant()调用为缓存字段的读取

@code {
    private Product? product = null;
    private string message;
    private int currentTypeId = 1;
    // 缓存当前选中的变体，避免渲染时重复查询
    private ProductVariant? selectedVariant;

    [Parameter]
    public int Id { get; set; }

    protected override async Task OnParametersSetAsync()
    {
        message = "Loading Product...";
        var result = await ProductService.GetProduct(Id);

        if (!result.Success)
        {
            message = result.Message;
        }
        else
        {
            product = result.Data;
            if (product.Variants.Count > 0)
            {
                currentTypeId = product.Variants[0].ProductTypeId;
                // 初始化时计算默认选中变体
                selectedVariant = product.Variants.FirstOrDefault(v => v.ProductTypeId == currentTypeId);
            }
        }
    }

    // 替换原字段为带变更回调的属性，供@bind绑定
    private int CurrentTypeId
    {
        get => currentTypeId;
        set
        {
            currentTypeId = value;
            // 类型ID变更时同步更新选中变体缓存
            selectedVariant = product?.Variants?.FirstOrDefault(v => v.ProductTypeId == currentTypeId);
        }
    }
}

对应Razor模板部分的select绑定改为@bind="CurrentTypeId"，所有原来调用GetSelectedVariant()的位置直接使用selectedVariant即可，既解决方法重复触发的问题，也能提升组件渲染性能。

内容的提问来源于stack exchange，提问作者キムヨンイン