数据绑定就是前端显示（页面元素的值）与后端数据（C#代码）是联动的。

可以是单向的（后端影响前端）也可以是双向的（前后端相互影响）。

1、单向：

看代码：

@page "/"
<PageTitle>@UserName</PageTitle>
<div>文本：<input value=@UserName/>
</div><button class="btn btn-primary" @onclick="onclick">@UserName</button> @code{private string UserName = "小明";private void onclick(){if (UserName == "小明"){UserName = "小黄";}else {UserName = "小明";}}
}

结果：

前端输入什么值，后端都不会发生变化。

后端code中改变了，前端就会受影响。

其中，@变量名 是引用后端变量，razor语法

2、双向：

@page "/"<PageTitle>@UserName</PageTitle><div>文本：@*<input value=@UserName/>*@<input @bind=UserName/> 
</div><button class="btn btn-primary">@UserName</button>@code{private string UserName = "小明";
}

结果：

可见，前端输入内容，后端直接发生变化了。