受欢迎的博客标签

Difference between @bind and @bind-value in ASP.NET Core Blazor 5.x

Published

What is the difference of using @bind and @bind-value?

I made this simple example, and testing it in the browser, I didn't see any difference.

p>@@bind @increment1</p>

<input 
    type="text"
    @bind="@increment1"
/>

<p>@@bind-value @increment2</p>
<input 
    type="text"
    @bind-value="@increment2"
/>

@code {
    string increment1;
    string increment2;
}

This page uses @Bind for binding to a variable--https://docs.microsoft.com/en-us/aspnet/core/blazor/components/data-binding?view=aspnetcore-5.0

The following page uses @bind-value --https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-5.0

 

@Bind for binding to a variable

 

 

@bind-value

An implementation of @bind-Value looks like this:

 ... @bind-value="userName" @bind-value:event="onchange" 

We are setting both the expression (="userName") and the delegate (="onchange").

 

@bind

@bind is an override of @bind-value with the event set to "onchange".

The @bind attribute accomplishes two separate (but related) tasks:

step 1:Binds an expression to the value of the <Input... component
step 2:Binds a delegate that will trigger the component's ValueChanged property

A greatly simplified analogy using overriding methods:

public void bind-value(string value, string event)
{..}

public void bind(string value)
{
  bind-value(value, "onchange");
}

 

The "easier" @bind= is just an override with the delegate preset to "onchange". So these two commands are functionally the same:

 ... @bind-value="userName" @bind-value:event="onchange" ...
 ... @bind="userName" ...

 

 

 

 

https://stackoverflow.com/questions/58221915/difference-between-bind-and-bind-value