双向绑定 TwoWay MVVM
1前台代码
- <Grid>
- <StackPanel >
- <Grid x:Name="gridOne">
- <Grid.Resources>
- <Style TargetType="TextBlock">
- <Setter Property="FontSize" Value="34"/>
- </Style>
- </Grid.Resources>
- <Grid.ColumnDefinitions>
- <ColumnDefinition Width="auto"/>
- <ColumnDefinition />
- </Grid.ColumnDefinitions>
- <Grid.RowDefinitions>
- <RowDefinition Height="auto"/>
- <RowDefinition Height="auto"/>
- </Grid.RowDefinitions>
- <TextBlock Text="姓名:" />
- <TextBlock Grid.Column="1" Text="{Binding Name}"/>
- <TextBlock Grid.Row="1" Text="城市:" />
- <TextBlock Grid.Column="1" Grid.Row="1" Text="{Binding City}"/>
- </Grid>
- <Grid x:Name="gridTwp">
- <Grid.Resources>
- <Style TargetType="TextBlock">
- <Setter Property="FontSize" Value="34"/>
- </Style>
- </Grid.Resources>
- <Grid.ColumnDefinitions>
- <ColumnDefinition Width="auto"/>
- <ColumnDefinition />
- </Grid.ColumnDefinitions>
- <Grid.RowDefinitions>
- <RowDefinition Height="auto"/>
- <RowDefinition Height="auto"/>
- </Grid.RowDefinitions>
- <TextBlock Text="姓名1:" />
- <TextBox Name="txtName" Grid.Column="1" Text="{Binding Name,Mode=TwoWay}"/>
- <TextBlock Grid.Row="1" Text="城市1:" />
- <TextBox Name="txtCity" InputScope="ChineseFullWidth" Grid.Column="1" Grid.Row="1" Text="{Binding City,Mode=TwoWay}"/>
- </Grid>
- </StackPanel>
- </Grid>
2后台方法
- public class Person : INotifyPropertyChanged
- {
- public event PropertyChangedEventHandler PropertyChanged;
- protected void OnPropertyChanged([CallerMemberName] string property="")
- {
- if (PropertyChanged!=null)
- {
- PropertyChanged(this, new PropertyChangedEventArgs(property));
- }
- }
- private string _name;
- public string Name
- {
- get
- {
- return _name;
- }
- set
- {
- if (_name!=value)
- {
- _name = value;
- OnPropertyChanged();
- }
- }
- }
- private string _city;
- public string City
- {
- get
- {
- return _city;
- }
- set
- {
- if (_city != value)
- {
- _city = value;
- OnPropertyChanged();
- }
- }
- }
- }
3数据绑定
- Person ps = new Person { Name="小刘" ,City="北京" };
- gridOne.DataContext = ps;
- gridTwp.DataContext = ps;
双向绑定 TwoWay MVVM的更多相关文章
- AngularJS中数据双向绑定(two-way data-binding)
1.切换工作目录 git checkout step-4 #切换分支,切换到第4步 npm start #启动项目 2.代码 app/index.html Search: <input ng-m ...
- js mvvm:闲来无事,实现一个只具最基本数据双向绑定的mvvm
近期项目内用knockoutjs. 想模拟实现数据双向绑定的基本功能. 只具有最基本的功能,且很多细节未曾考虑,也未优化精简. 能想到的缺少的模块 1事件监听,自定义访问器事件 2模版 3父子级 编码 ...
- AngularJS学习--- AngularJS中数据双向绑定(two-way data-binding) orderBy step4
1.切换工作目录 git checkout step- #切换分支,切换到第4步 npm start #启动项目 2.代码 app/index.html Search: <input ng-mo ...
- MVVM 框架解析之双向绑定
更好的阅读体验,点击 原文地址 MVVM 框架 近年来前端一个明显的开发趋势就是架构从传统的 MVC 模式向 MVVM 模式迁移.在传统的 MVC 下,当前前端和后端发生数据交互后会刷新整个页面,从而 ...
- 【学习笔记】剖析MVVM框架,简单实现Vue数据双向绑定
前言: 学习前端也有半年多了,个人的学习欲望还比较强烈,很喜欢那种新知识在自己的演练下一点点实现的过程.最近一直在学vue框架,像网上大佬说的,入门容易深究难.不管是跟着开发文档学还是视频教程,按步骤 ...
- vue实现数据双向绑定的原理
一.知识准备Object.defineProperty( )方法可以直接在一个对象上定义一个新属性,或者修改一个已经存在的属性,并返回这个对象.Object.defineProperty(obj,pr ...
- vue - 数据驱动,组件化, 双向绑定原理
1.数据驱动 传统的前端数据交互是用Ajax从服务端获取数据,然后操作DOM来改变视图: Vue.js 是一个提供了 MVVM 风格的双向数据绑定的 Javascript 库,专注于View 层.它让 ...
- vue 之 双向绑定原理
一.实现双向绑定 详细版: 前端MVVM实现双向数据绑定的做法大致有如下三种: 1.发布者-订阅者模式(backbone.js) 思路:使用自定义的data属性在HTML代码中指明绑定.所有绑定起来的 ...
- C#使用Xamarin开发可移植移动应用(3.进阶篇MVVM双向绑定和命令绑定)附源码
前言 系列目录 C#使用Xamarin开发可移植移动应用目录 源码地址:https://github.com/l2999019/DemoApp 可以Star一下,随意 - - 说点什么.. 嗯..前面 ...
随机推荐
- Win7+vs2010下安装boost_1_46_1库
一.boost库分类: (1)不需要编译库:any.array.asio.conversion.crc.bind/mem_fn.enable_if.function.lambda.mpl.smart_ ...
- Qt调用Delphi编写的COM组件
这个问题捣鼓了两天,现在终于解决了,做个笔记分享给大家,以免走弯路 起初,我的想法是在DLL中写一个interface并从函数中导出这个interface,像这样的代码 ICom1 = interfa ...
- BZOJ 2096([Poi2010]Pilots-单调队列-差值)
2096: [Poi2010]Pilots Time Limit: 30 Sec Memory Limit: 162 MB Submit: 190 Solved: 97 [ Submit][ ...
- FOJ 2170 花生的序列 dp
题目链接:http://acm.fzu.edu.cn/problem.php? pid=2170 贴个baka爷的代码留念.. 数据出的有问题.输入的字符串长度不超过1000 #include< ...
- Codeforces Round #350 (Div. 2)解题报告
codeforces 670A. Holidays 题目链接: http://codeforces.com/contest/670/problem/A 题意: A. Holidays On the p ...
- BPL vs. DLL
第一部分:有关包的介绍 一般我们编写编译一个DELPHI应用程序时,会产生一个EXE文件,也就是一个独立的WINDOWS应用程序.很重要的一点:区别于Visual Basic,DELPHI产生的是预先 ...
- [Android学习笔记]ShareSDK的使用
ShareSDK使用方便,集成简单,正式客户端开发人员的首选组件 集成步骤,使用说明见官方文档: http://wiki.sharesdk.cn/Android_快速集成指南 记录: 直接使用官方De ...
- [SVN]常见问题的解决方案
Date:2014-1-3 Summary: SVN使用的一些常见问题解决方案记录,来源Internet,本人亲测 Contents: 1.回滚自己的分支到某一个版本 $svn merge -r rH ...
- [置顶] 页面缓存,cache,设置缓存过期时间,OutputCache
页面缓存 方法一: protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { //缓存有数据 if (Cach ...
- Visual Leak Detector(vld)无法显示内存泄露文件名称与行号
使用VLD測有没内存泄露的时候,出现(File and line number not available): (Function name unavailable) 查看VS控制台,发现 已载入&q ...