ASP.Net 核心 Blazor 数据绑定中断答案

【问题标题】：ASP.Net core Blazor data binding brokeASP.Net 核心 Blazor 数据绑定中断
【发布时间】：2019-06-27 15:49:50
【问题描述】：

在过去的 2 天里，不知何故，我与模型的数据绑定在用于“添加新”和“更新”数据库记录的页面上损坏了。我有以下代码 - 我将其最小化以供查看。

@page "/NewRepairOrder"
@using ShopLiveWebVersion2._0.Models
@using ShopLiveWebVersion2._0.DataAccess
@using ShopLiveWebVersion2._0.Services
@using ShopLiveWebVersion2._0.Data
@inject IUriHelper UriHelper
@inject RepairOrderContext context

    <div class="container">
        @if (RO == null)
        {
            <div class="row">
                <div class="col-lg-6 float-right">
                    <h2>Loading....</h2>
                </div>
            </div>
        }
        else
        {
            <div class="row">
                <div class="col-lg-1"></div>
                <div class="col-lg-10">
                    <h2>Add New Repair Order</h2>
                    <h4>@ErrorMessage</h4>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-1"></div>
                <div class="col-lg-2">
                    <label for="ControlNumber" class="Control-label">Repair Order #:"</label>
                    <input for="ControlNumber" class="form-control" bind="@RO.ControlNumber" maxlength="15" required />
                </div>

页面的 HTML 继续包含其他输入和选择框。下面是整个 Functions 代码块。

@functions
{
    private OptionsDataAccess OpsData;
    private RepairOrderDataAccess ROData;

    private List<LocationOptions> LocationOps;
    private List<EmployeeOptions> EmployeeOps;
    private List<StatusOptions> StatusOps;

    private RepairOrder RO = new RepairOrder();
    private string ErrorMessage;


    protected override async Task OnInitAsync()
    {
        LocationOps = new List<LocationOptions>();
        EmployeeOps = new List<EmployeeOptions>();
        StatusOps = new List<StatusOptions>();

        OpsData = new OptionsDataAccess(context);
        ROData = new RepairOrderDataAccess(context);

        LocationOps = await Task.Run(() => OpsData.GetAllLocationOptions());
        EmployeeOps = await Task.Run(() => OpsData.GetAllEmployeeOptions());
        StatusOps = await Task.Run(() => OpsData.GetAllStatusOptions());

    }

    private void SaveRepairOrder()
    {

        try
        {
            ROData.AddRepairOrder(RO);
            //UriHelper.NavigateTo("/Home");
        }
        catch
        {
            ErrorMessage = "Could not Save the Data -- try again";
        }

    }
}

我最初有“RO = new RepairOrder();”在声明位于外部时的 InitAsync() 方法中。投掷吐水球我将它作为一个内衬包含在方法之外。

当我点击保存按钮时，一个全为 NULL 值的 RO 存储在数据库中。

我在页面底部添加了标签元素，绑定了与输入相同的数据，选择关闭页面前查看效果，它们也显示为NULL。

我还尝试为每个创建单独的字符串项，然后在 RO 发送到数据库之前执行“RO.= {item};”。

有没有人看到绑定被这样禁用？？

【问题讨论】：

标签： asp.net data-binding blazor-server-side

【解决方案1】：

对此的简单回答是确保您阅读了对所更新内容的更改。最新更新有一些重要的重大变化。吸引我的是数据绑定。

我必须更改我的所有代码：

<div class="col-lg-2">
      <label for="ControlNumber" class="Control-label">Repair Order #:"</label>
      <input for="ControlNumber" class="form-control" bind="@RO.ControlNumber" maxlength="15" required />
</div>

到新的数据绑定方式：

<div class="col-lg-2">
      <label for="ControlNumber" class="Control-label">Repair Order #:"</label>
      <input for="ControlNumber" class="form-control" @bind="RO.ControlNumber" maxlength="15" required />
</div>

要将元素绑定到“函数”或“代码”（现在称为）中的方法，您使用的格式略有不同。

<button class="btn" @onclick="@DoSomthing">Click Me</button>

我会注意到新样式的数据绑定确实杀死了我在对象中的智能感知。 intellisense 会显示对象名称，但一旦您点击“输入”或选择对象，intellisense 中不会弹出任何内部项目。

我今天重新学到的最重要的一课 - 始终阅读更改文件！

【讨论】：