在 Blazor 组件中使用 for 循环获取 ArgumentOutOfRangeException

Question

我正在尝试 Blazor，当我尝试使用 for 循环加载复选框列表时遇到此异常。

我在这里创建了列表：

public List<Month> Months { get; set; }

protected override void OnInitialized()
        {
            List<Month> months = new List<Month>()
            {
                new Month{MonthId = 0, MonthName = "All Months", isMonthChecked = false},
                new Month{MonthId = 1, MonthName = "Jan", isMonthChecked = false},
                new Month{MonthId = 2, MonthName = "Feb", isMonthChecked = false},
                new Month{MonthId = 3, MonthName = "Mar", isMonthChecked = false},
                new Month{MonthId = 4, MonthName = "Apr", isMonthChecked = false},
                new Month{MonthId = 5, MonthName = "May", isMonthChecked = false},
                new Month{MonthId = 6, MonthName = "Jun", isMonthChecked = false},
                new Month{MonthId = 7, MonthName = "Jul", isMonthChecked = false},
                new Month{MonthId = 8, MonthName = "Aug", isMonthChecked = false},
                new Month{MonthId = 9, MonthName = "Sep", isMonthChecked = false},
                new Month{MonthId = 10, MonthName = "Oct", isMonthChecked = false},
                new Month{MonthId = 11, MonthName = "Nov", isMonthChecked = false},
                new Month{MonthId = 12, MonthName = "Dec", isMonthChecked = false}
            };
};

            Months = months.ToList();
            base.OnInitialized();

然后，我在 Blazor 组件中创建了循环：

@{ 
            for (int i = 0; i < @Months.Count(); i++)
            {
            <ul>
                <li><label for="@Months[i].MonthId" id="checkboxLabel">@Months[i].MonthName</label></li>
                <li><InputCheckbox id="@Months[i].MonthId" @bind-Value="@Months[i].isMonthChecked"></InputCheckbox></li>
            </ul>
            }
        }

我已经单步调试了调试器，它正在提取正确的数据，但是当它完成时，它给了我错误。如果我将计数减少到 12（应该是 13），它就会起作用。不知道这里发生了什么。

Answer 1

你可以这样解决：

@for (int j = 0; j < Months.Count; j++)
{
    int i = j;  // a local copy to solve the capture problem

    <ul>
        <li><label for="@Months[i].MonthId" id="checkboxLabel">@Months[i].MonthName</label></li>
        <li><InputCheckbox id="@Months[i].MonthId" @bind-Value="@Months[i].isMonthChecked"></InputCheckbox></li>
    </ul>
}

这意味着这是“捕获循环变量”的新的 Blazor 特定变体。

当您查看该<pagename>.razor.g.cs文件时，您可以看到该复选框需要两个 lambda，以下是一个片段：

 __value => Months[i].isMonthChecked = __value

在for循环之后，当构建RenderTree时， 的值i将是所有月份的Count。

在原始代码中使用Count()-1（您的临时修复）将防止出现异常，但请注意，表单将无法正常运行，将检查错误的月份。

一般结论：不要将 EditForm 与 for 循环混合使用。foreach()是安全的。