Blazor双向绑定

基本的双向绑定：您可以使用 @bind 指令将组件的属性与用户界面元素的属性进行绑定。这是一个文本框的例子：

You entered: @myValue

@code {
    private string myValue = "Initial Value";
}

在这个示例中，myValue 字符串与文本框的值双向绑定。当用户更改文本框的值时，myValue 将自动更新，反之亦然。

复杂对象的双向绑定：您也可以在 Blazor 中实现复杂对象的双向绑定，例如表单输入与数据模型。这是一个表单的例子：

    Name:
    

    Age:
    

    Submit


Name: @person.Name
Age: @person.Age

@code {
    private Person person = new Person();

    public class Person
    {
        public string Name { get; set; }
        public int Age { get; set; }
    }
}

在这个示例中，@bind 用于将输入框的值与 person 对象的属性进行双向绑定，以便在表单提交时，person 对象中的属性会更新。

自定义组件中的双向绑定：您还可以在自定义组件中使用双向绑定。这是一个自定义组件的示例：

Parent Value: @parentValue

@code {
    private string parentValue = "Parent Initial Value";
}




@code {
    [Parameter]
    public string MyValue { get; set; }
}

在这个示例中，@bind-MyValue 用于在父组件中与 MyCustomComponent 组件的属性进行双向绑定。