1前台代码

  1. <Grid>
  2. <StackPanel >
  3. <Grid x:Name="gridOne">
  4. <Grid.Resources>
  5. <Style TargetType="TextBlock">
  6. <Setter Property="FontSize" Value="34"/>
  7. </Style>
  8. </Grid.Resources>
  9. <Grid.ColumnDefinitions>
  10. <ColumnDefinition Width="auto"/>
  11. <ColumnDefinition />
  12. </Grid.ColumnDefinitions>
  13. <Grid.RowDefinitions>
  14. <RowDefinition Height="auto"/>
  15. <RowDefinition Height="auto"/>
  16. </Grid.RowDefinitions>
  17. <TextBlock Text="姓名:" />
  18. <TextBlock Grid.Column="1" Text="{Binding Name}"/>
  19. <TextBlock Grid.Row="1" Text="城市:" />
  20. <TextBlock Grid.Column="1" Grid.Row="1" Text="{Binding City}"/>
  21. </Grid>
  22. <Grid x:Name="gridTwp">
  23. <Grid.Resources>
  24. <Style TargetType="TextBlock">
  25. <Setter Property="FontSize" Value="34"/>
  26. </Style>
  27. </Grid.Resources>
  28. <Grid.ColumnDefinitions>
  29. <ColumnDefinition Width="auto"/>
  30. <ColumnDefinition />
  31. </Grid.ColumnDefinitions>
  32. <Grid.RowDefinitions>
  33. <RowDefinition Height="auto"/>
  34. <RowDefinition Height="auto"/>
  35. </Grid.RowDefinitions>
  36. <TextBlock Text="姓名1:" />
  37. <TextBox Name="txtName" Grid.Column="1" Text="{Binding Name,Mode=TwoWay}"/>
  38. <TextBlock Grid.Row="1" Text="城市1:" />
  39. <TextBox Name="txtCity" InputScope="ChineseFullWidth" Grid.Column="1" Grid.Row="1" Text="{Binding City,Mode=TwoWay}"/>
  40. </Grid>
  41. </StackPanel>
  42. </Grid>

2后台方法

  1. public class Person : INotifyPropertyChanged
  2. {
  3. public event PropertyChangedEventHandler PropertyChanged;
  4. protected void OnPropertyChanged([CallerMemberName] string property="")
  5. {
  6. if (PropertyChanged!=null)
  7. {
  8. PropertyChanged(this, new PropertyChangedEventArgs(property));
  9. }
  10. }
  11. private string _name;
  12.  
  13. public string Name
  14. {
  15. get
  16. {
  17. return _name;
  18. }
  19.  
  20. set
  21. {
  22. if (_name!=value)
  23. {
  24. _name = value;
  25. OnPropertyChanged();
  26. }
  27. }
  28. }
  29. private string _city;
  30.  
  31. public string City
  32. {
  33. get
  34. {
  35. return _city;
  36. }
  37.  
  38. set
  39. {
  40. if (_city != value)
  41. {
  42. _city = value;
  43. OnPropertyChanged();
  44. }
  45. }
  46. }
  47.  
  48. }

3数据绑定

  1. Person ps = new Person { Name="小刘" ,City="北京" };
  2. gridOne.DataContext = ps;
  3. gridTwp.DataContext = ps;

双向绑定 TwoWay MVVM的更多相关文章

  1. AngularJS中数据双向绑定(two-way data-binding)

    1.切换工作目录 git checkout step-4 #切换分支,切换到第4步 npm start #启动项目 2.代码 app/index.html Search: <input ng-m ...

  2. js mvvm:闲来无事,实现一个只具最基本数据双向绑定的mvvm

    近期项目内用knockoutjs. 想模拟实现数据双向绑定的基本功能. 只具有最基本的功能,且很多细节未曾考虑,也未优化精简. 能想到的缺少的模块 1事件监听,自定义访问器事件 2模版 3父子级 编码 ...

  3. AngularJS学习--- AngularJS中数据双向绑定(two-way data-binding) orderBy step4

    1.切换工作目录 git checkout step- #切换分支,切换到第4步 npm start #启动项目 2.代码 app/index.html Search: <input ng-mo ...

  4. MVVM 框架解析之双向绑定

    更好的阅读体验,点击 原文地址 MVVM 框架 近年来前端一个明显的开发趋势就是架构从传统的 MVC 模式向 MVVM 模式迁移.在传统的 MVC 下,当前前端和后端发生数据交互后会刷新整个页面,从而 ...

  5. 【学习笔记】剖析MVVM框架,简单实现Vue数据双向绑定

    前言: 学习前端也有半年多了,个人的学习欲望还比较强烈,很喜欢那种新知识在自己的演练下一点点实现的过程.最近一直在学vue框架,像网上大佬说的,入门容易深究难.不管是跟着开发文档学还是视频教程,按步骤 ...

  6. vue实现数据双向绑定的原理

    一.知识准备Object.defineProperty( )方法可以直接在一个对象上定义一个新属性,或者修改一个已经存在的属性,并返回这个对象.Object.defineProperty(obj,pr ...

  7. vue - 数据驱动,组件化, 双向绑定原理

    1.数据驱动 传统的前端数据交互是用Ajax从服务端获取数据,然后操作DOM来改变视图: Vue.js 是一个提供了 MVVM 风格的双向数据绑定的 Javascript 库,专注于View 层.它让 ...

  8. vue 之 双向绑定原理

    一.实现双向绑定 详细版: 前端MVVM实现双向数据绑定的做法大致有如下三种: 1.发布者-订阅者模式(backbone.js) 思路:使用自定义的data属性在HTML代码中指明绑定.所有绑定起来的 ...

  9. C#使用Xamarin开发可移植移动应用(3.进阶篇MVVM双向绑定和命令绑定)附源码

    前言 系列目录 C#使用Xamarin开发可移植移动应用目录 源码地址:https://github.com/l2999019/DemoApp 可以Star一下,随意 - - 说点什么.. 嗯..前面 ...

随机推荐

  1. Win7+vs2010下安装boost_1_46_1库

    一.boost库分类: (1)不需要编译库:any.array.asio.conversion.crc.bind/mem_fn.enable_if.function.lambda.mpl.smart_ ...

  2. Qt调用Delphi编写的COM组件

    这个问题捣鼓了两天,现在终于解决了,做个笔记分享给大家,以免走弯路 起初,我的想法是在DLL中写一个interface并从函数中导出这个interface,像这样的代码 ICom1 = interfa ...

  3. BZOJ 2096([Poi2010]Pilots-单调队列-差值)

    2096: [Poi2010]Pilots Time Limit: 30 Sec   Memory Limit: 162 MB Submit: 190   Solved: 97 [ Submit][ ...

  4. FOJ 2170 花生的序列 dp

    题目链接:http://acm.fzu.edu.cn/problem.php? pid=2170 贴个baka爷的代码留念.. 数据出的有问题.输入的字符串长度不超过1000 #include< ...

  5. Codeforces Round #350 (Div. 2)解题报告

    codeforces 670A. Holidays 题目链接: http://codeforces.com/contest/670/problem/A 题意: A. Holidays On the p ...

  6. BPL vs. DLL

    第一部分:有关包的介绍 一般我们编写编译一个DELPHI应用程序时,会产生一个EXE文件,也就是一个独立的WINDOWS应用程序.很重要的一点:区别于Visual Basic,DELPHI产生的是预先 ...

  7. [Android学习笔记]ShareSDK的使用

    ShareSDK使用方便,集成简单,正式客户端开发人员的首选组件 集成步骤,使用说明见官方文档: http://wiki.sharesdk.cn/Android_快速集成指南 记录: 直接使用官方De ...

  8. [SVN]常见问题的解决方案

    Date:2014-1-3 Summary: SVN使用的一些常见问题解决方案记录,来源Internet,本人亲测 Contents: 1.回滚自己的分支到某一个版本 $svn merge -r rH ...

  9. [置顶] 页面缓存,cache,设置缓存过期时间,OutputCache

    页面缓存 方法一: protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { //缓存有数据 if (Cach ...

  10. Visual Leak Detector(vld)无法显示内存泄露文件名称与行号

    使用VLD測有没内存泄露的时候,出现(File and line number not available): (Function name unavailable) 查看VS控制台,发现 已载入&q ...