C# 用户界面不'；t在Blazor中保留所选项目的复选框值

我有一个MatBlazor表，它有一个数据源（Items）和与表中每一行关联的复选框。如果我使用@bind Value，我就不会有任何问题，所有工作都按设计进行。但我正在向一个按钮添加验证，该按钮取决于是否“选中”列表中的任何项目以启用它

因此，我转而使用ValueChanged属性，它是一个EventCallback，并且没有机会用所选的值更新UI

我尝试调用StateHasChanged（）甚至InvokeAsync（），但UI没有更新

  <MatTable Items="@Projects" class="mat-elevation-z5 create-build-list" PageSize="50" ShowPaging="false" FilterByColumnName="ProjectName" Striped="true">
                        <MatTableHeader>
                            <th>Name</th>
                            <th>Key</th>
                            <th>Type</th>
                            <th>Include</th>
                        </MatTableHeader>
                        <MatTableRow>
                            <td>@context.ProjectName</td>
                            <td>@context.Key</td>
                            <td>@context.ProjectType</td>
                            <td><MatCheckbox Label="Add To Build" ValueChanged="@((bool val) => CheckBoxValue(val, context))" ValueExpression="@(() => context.IsChecked)"></MatCheckbox></td>
                        </MatTableRow>
                    </MatTable>

---

我不确定这是否是Blazor/MatBlazor的预期行为，但我面临着同样的问题，我找到的唯一解决方案是首先使用“Value”而不是“ValueExpression”，因为这没有为我正确设置UI，然后直接在“ValueChanged”回调中设置“context”中的字段值，这导致UI更新为“context”中设置的值

因此，如果您将Razor代码更改为：-

<MatTable Items="@Projects" class="mat-elevation-z5 create-build-list" PageSize="50" ShowPaging="false" FilterByColumnName="ProjectName" Striped="true">
<MatTableHeader>
    <th>Name</th>
    <th>Key</th>
    <th>Type</th>
    <th>Include</th>
</MatTableHeader>
<MatTableRow>
    <td>@context.ProjectName</td>
    <td>@context.Key</td>
    <td>@context.ProjectType</td>
    <td><MatCheckbox Label="Add To Build" Value="@context.IsChecked" ValueChanged="@((bool val) => CheckBoxValue(val, context))"></MatCheckbox></td>
</MatTableRow>

void CheckBoxValue(bool val, MyProjectKey context)
{
    // This line updates the UI
    context.IsChecked = val;
    
    foreach (var p in Projects)
    {
        if (p.Key == context.Key)
        {
            p.IsChecked = true;
        }
    };
    
    // I'll do more stuff here.
}

希望这能奏效

我面临的另一个问题是与实体框架有关，因此您可能会或可能不会遇到与我相同的问题，这取决于您在回调中执行的其他操作

不管是好是坏，我在ValueChanged回调中调用了数据库插入/更新。但问题是，实体框架正在“跟踪”表列表中的所有模型，更新Blazor“上下文”（而不是DbContext）也在修改被跟踪的实体

但是，因为它只是一个用于显示表行/列的模型列表，所以我在DbContext调用中添加了“AsNoTracking”。如果我没有这样做，我会在下一次调用“SaveChanges”时，在EF尝试保存值时出错（所讨论的数据库集只是链接到数据库中的一个视图，该视图显然是只读的！！；-）

编辑

---

抱歉，忘了提到这是在Blazor服务器项目上，因此如果您使用Blazor客户端项目，EF跟踪可能不会影响您…

我不确定这是否是Blazor/MatBlazor的预期行为，但我也面临同样的问题，我找到的唯一解决方案是首先使用“Value”而不是“ValueExpression”，因为这没有为我正确设置UI，然后直接在“ValueChanged”回调中设置“context”中的字段值，这导致UI更新为“context”中设置的值

因此，如果您将Razor代码更改为：-

<MatTable Items="@Projects" class="mat-elevation-z5 create-build-list" PageSize="50" ShowPaging="false" FilterByColumnName="ProjectName" Striped="true">
<MatTableHeader>
    <th>Name</th>
    <th>Key</th>
    <th>Type</th>
    <th>Include</th>
</MatTableHeader>
<MatTableRow>
    <td>@context.ProjectName</td>
    <td>@context.Key</td>
    <td>@context.ProjectType</td>
    <td><MatCheckbox Label="Add To Build" Value="@context.IsChecked" ValueChanged="@((bool val) => CheckBoxValue(val, context))"></MatCheckbox></td>
</MatTableRow>

void CheckBoxValue(bool val, MyProjectKey context)
{
    // This line updates the UI
    context.IsChecked = val;
    
    foreach (var p in Projects)
    {
        if (p.Key == context.Key)
        {
            p.IsChecked = true;
        }
    };
    
    // I'll do more stuff here.
}

希望这能奏效

我面临的另一个问题是与实体框架有关，因此您可能会或可能不会遇到与我相同的问题，这取决于您在回调中执行的其他操作

不管是好是坏，我在ValueChanged回调中调用了数据库插入/更新。但问题是，实体框架正在“跟踪”表列表中的所有模型，更新Blazor“上下文”（而不是DbContext）也在修改被跟踪的实体

但是，因为它只是一个用于显示表行/列的模型列表，所以我在DbContext调用中添加了“AsNoTracking”。如果我没有这样做，我会在下一次调用“SaveChanges”时，在EF尝试保存值时出错（所讨论的数据库集只是链接到数据库中的一个视图，该视图显然是只读的！！；-）

编辑

---

抱歉，忘记提到这是在Blazor服务器项目上，因此如果您使用Blazor客户端项目，EF跟踪可能不会影响您…

您的意思是传递上下文。方法的密钥吗？你似乎在传递整个上下文/项目，如果我将类型更改为string，只传递“Key”，而不传递对象，则得到相同的结果。@code{}块中的模型显示它已更新，但UI不保存所选内容。我还尝试添加StateHasChanged（）组件.Base方法来通知重新渲染，但视图仍然没有保存更改。这很奇怪。你的意思是传递上下文。方法的键吗？你似乎在传递整个上下文/项目，如果我将类型更改为string，只传递“Key”，而不传递对象，则得到相同的结果。@code{}块中的模型显示它已更新，但UI不保存所选内容。我还尝试添加StateHasChanged（）组件.Base方法来通知重新渲染，但视图仍然没有保存更改。这很奇怪。