Blazor 自定义绑定 - 获取已更改的 model 的属性

Question

我从 SQL 服务器接收数据并将其加载到 model 中：

namespace BlazorServer.Models
{
    public class Animal
    {
        public int height { get; set; }

        public string name { get; set; }

        public string origin { get; set; }
    }
}

在一个组件中，我使用 model 来显示数据。 用户可以编辑数据。 这是一个示例：

<input @onchange="args => ValueChanged(args)" value="@animal.name" class="form-control form-control-sm border rounded" />

如何获取 model 的哪个属性发生了变化？ 我尝试了以下方法，但我只得到了新值：

private void ValueChanged(ChangeEventArgs args)
{
    var newValue = args.Value;
}

我想更新组件中的 model（相当于 blazor 的绑定） ，并立即将数据发送到 SQL 服务器。

Answer 1

Blazor 带有管理EditContext的EditForm和一组输入控件 - 在您的情况下为InputText - 与EditContext接口。 您可以访问EditContext ，在OnFieldChanged上注册事件处理程序并获取更改事件。 您会获得一个FieldIdentifier ，您可以使用它来识别已更改的字段。

请参阅 - MS 文档

这是一个简单的 razor 页面，使用EditContext和OnFieldChanged进行演示

@page "/Test"

@implements IDisposable

<EditForm EditContext="this.editContext" class="m-3">
    Animal: <InputText @bind-Value="this.model.name"></InputText><br />
    Origin: <InputText @bind-Value="this.model.origin"></InputText><br />
</EditForm>

<div class="m-3">FieldChanged:<i>@this.FieldChanged</i> </div>


@code {

    public class Animal
    {
        public int height { get; set; }
        public string name { get; set; }
        public string origin { get; set; }
    }

    private Animal model = new Animal() { height = 2, name = "giraffe", origin = "Africa" };

    private EditContext editContext;

    private string FieldChanged = "none";

    protected override Task OnInitializedAsync()
    {
        this.editContext = new EditContext(model);
        this.editContext.OnFieldChanged += this.OnFieldChanged;
        return base.OnInitializedAsync();
    }

    private void OnFieldChanged(object sender, FieldChangedEventArgs e)
    {
        var x = e.FieldIdentifier;
        this.FieldChanged = e.FieldIdentifier.FieldName;

    }

    // Need to  Implement IDisosable to unhook event handler
    public void Dispose ()
    {
        this.editContext.OnFieldChanged -= OnFieldChanged;
    }
}