blazor 中的 ValueChanged 和 ValueEpression？

Question

我已经在 blazor 组件中看到了 ValueChanged 和 ValueExpression 的使用，但不知道它们的用途以及 ValueChanged 和 ValueEpression 在 blazor 中的作用？

如果有人能用简单的语言解释它们，那将是一个很大的帮助/

Answer 1

请查看InputBase Class Properties:

• ValueChanged：获取或设置更新绑定值的回调。

• ValueExpression：获取或设置一个标识绑定值的表达式。

通常，Razor 组件通过名为 @bind 的 HTML 元素属性提供数据绑定功能，该属性带有字段、属性或 Razor 表达式值，我们可以使用它将值绑定到 html 元素。如果我们不使用bind 属性，我们可以使用ValueExpression 和ValueChanged 来更新绑定值。请参考以下示例：

<EditForm Model="form">
    <p>Current value: @form.MyProperty</p>
    <InputSelect ValueChanged="@((string s) => DoThing(s))"
                 ValueExpression="@(()=> form.MyProperty)">
        <option value="0">0</option>
        <option value="100">100</option>
        <option value="200">200</option>
        <option value="300">300</option>
    </InputSelect> 
</EditForm>

@code {
    MyForm form = new MyForm(); //create an model instance.

    void DoThing(string s) //value changed event.
    {
        form.MyProperty = s; //get the current selected value and assign to the Model.
    }
    //define a class to get/set the dropdownlist selected value.
    public class MyForm
    {
        public string MyProperty { get; set; }
    } 
} 

如果使用@bind属性，示例代码如下：

    <p>Current Season: @model.Season</p>
    <InputSelect @bind-Value="model.Season">
        @foreach (var value in Enum.GetValues(typeof(Season)))
        {
            <option>@value</option>
        }
    </InputSelect>

@code { 
    Model model = new Model();    
    class Model
    {
        public Season Season { get; set; }
    }    
    enum Season
    {
        Spring,
        Summer,
        Autumn,
        Winter
    } 
}  

截图如下：

参考：

ASP.NET Core Blazor data binding