实例讲解wpf数据绑定及值转换的应用

先谈谈MVVM

谈起MVVM并不陌生了，最开始接触MVVM是在做一个web项目，这个web项目是用在移动端，使用了ionic+angularJs,期初使用的时候对MVVM并不是很了解，经过一段时间的使用发现，其实MVVM是对MVC的延展，现在前端技术越来越多，而且前端的工作也越来越多，不仅仅是做个页面的事情了，随着nodejs的兴起，前段好像无所不能了，做起了后端的事情，这里MVVM其实也有这个意思，随着MVC应用的越来越广泛，大家发现了一个问题：C层越来越大，业务逻辑全部在这块。MVVM是为了解决这个问题而出现的。

MVVM（Model-View-view-Model）,这种模式上突出一点“数据绑定”:将Model和View进行绑定，Model的数据变化时View上的展示就随之变化，然后有一个View-Model 就是写在前端的数据转换工具，angular其实本质上是将后端的开发模型引入到了前端，在前端完成数据整理的工作。

wpf的MVVM

1.UI对象绑定

将源控件的某个属性绑定到目标控件的某个属性上，绑定的语法：Text=”{Binding ElementName=SourceObjectName, Path=SourceProperty}”

看个例子：实例讲解wpf数据绑定及值转换的应用

我们将姓名1后textbox的text属性绑定到姓名后的textbox的text属性上，当我在姓名后面输入什么，姓名1后也会显示一样的内容

代码：

<TextBlock Grid.Row="1" Grid.Column="1" Text="姓       名"   Style="{StaticResource UserInfoTextBlockStyle}"></TextBlock> 
            <TextBox x:Name="main_userInfo_name_tbx" Grid.Row="1" Grid.Column="2"  Style="{StaticResource UserInfoTextBoxStyle}"></TextBox>
            <TextBlock Grid.Row="1" Grid.Column="3"  Text="姓       名1"   Style="{StaticResource UserInfoTextBlockStyle}" ></TextBlock>
            <TextBox x:Name="main_userInfo_phoneNO_tbx" Text="{Binding ElementName=main_userInfo_name_tbx,Path=Text }"  Grid.Row="1" Grid.Column="4" Style="{StaticResource UserInfoTextBoxStyle}"></TextBox>

View Code