mvvm的优势
之前在项目中有个功能,是根据数据模型生成页面,然后页面变动之后,再同步到数据模型之中。
当时用的jquery写的,一点一点的控制,整个功能写下来、测试,花了很长时间,而且还担心出bug。
现在用mvvm思想的类库knockoutjs重构下,发现是如此的轻松,完全不用考虑dom变化的细节。
下面贴出关键代码:
<div data-bind="foreach:groups">
<label>
<input type="checkbox" data-bind="attr:{checked:isCheck},value:groupId" /><span data-bind="text:groupName"></span>
</label>
</div>
<script>
var viewModel = function () {
groups = ko.observableArray([
{ groupId: 1, groupName: '.net', isCheck: true },
{ groupId: 2, groupName: '.ef', isCheck: false },
{ groupId: 3, groupName: '.mvc', isCheck: true }
])
};
ko.applyBindings(new viewModel());
</script>
好的工具真的是事半功倍。
mvvm的优势的更多相关文章
- iOS——MVVM设计模式
一.典型的iOS构架——MVC 在典型的MVC设置中,Model呈现数据,Vie呈现用户界面,而ViewController调节它两者之间的交互. 虽然View和View Controller是技术上 ...
- 前端MVVM学习之KnockOut(一)
MVVM理解 MVVM即Model-View-viewModel,是微软WPF和MVP(Model-View-Presenter)结合发展演变过来的一种新型架构框架. MVVM设计模式有以下优点: ( ...
- 谈MVVM
什么是MVVM? MVVM(模型-视图-视图模型,Model-View-ViewModal)是一种架构模式,并非一种框架,它是一种思想,一种组织与管理代码的艺术.它利用数据绑定,属性依赖,路由事件,命 ...
- WPF自学入门(十)WPF MVVM简单介绍
前面文章中,我们已经知道,WPF技术的主要特点是数据驱动UI,所以在使用WPF技术开发的过程中是以数据为核心的,WPF提供了数据绑定机制,当数据发生变化时,WPF会自动发出通知去更新UI. 我们不管 ...
- 如何构建Android MVVM 应用框架
概述 说到Android MVVM,相信大家都会想到Google 2015年推出的DataBinding框架.然而两者的概念是不一样的,不能混为一谈.MVVM是一种架构模式,而DataBinding是 ...
- iOS 关于MVC和MVVM设计模式的那些事
一.概述 在 iOS 开发中,MVC(Model View Controller)是构建iOS App的标准模式,是苹果推荐的一个用来组织代码的权威范式.Apple甚至是这么说的.在MVC下,所有的对 ...
- [干货分享]一篇可能会让你爱上MVVM与ReactiveCocoa的文章
概要 在此工程中,本文将讨论将MVC改造为MVVM需要的一些基本方法,同时会适当穿插部分关于MVVM概念性的讨论!本文最大的意义在于,提供了一种读者可以复现的方式,逐步引出从MVC向MVVM尽可能平滑 ...
- WPF自学入门(十一)WPF MVVM模式Command命令 WPF自学入门(十)WPF MVVM简单介绍
WPF自学入门(十一)WPF MVVM模式Command命令 在WPF自学入门(十)WPF MVVM简单介绍中的示例似乎运行起来没有什么问题,也可以进行更新.但是这并不是我们使用MVVM的正确方式 ...
- 36 (OC)* MVC和MVVM
1:MVC (Modal View Controller)(模型 视图 控制器) 一.MVC 从字面意思来理解,MVC 即 Modal View Controller(模型 视图 控制器),是 Xe ...
随机推荐
- varnish
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...
- ExtJs知识点概述
1.前言 ExtJS的前身是YUI(Yahoo User Interface).经过不断的发展与改进,ExtJS现在已经成功发布到了ExtJS 6版本,是一套目前最完整和最成熟的javascript基 ...
- windows下远程桌面连接centos
最近,由于项目需要,必须要在centos下进行操作.习惯了图形界面的我,通过黑框框来远程操作服务器,着实让人难受.但是,windows自带的远程桌面工具貌似不能直接连centos.所以,只能借助其他工 ...
- 对ArrayList操作时报错java.util.ConcurrentModificationException null
用iterator遍历集合时要注意的地方:不可以对iterator相关的地方做添加或删除操作.否则会报java.util.ConcurrentModificationException 例如如下代码: ...
- PHP正则表达式 /i, /is, /s, /isU等
PHP正则表达式 /i, /is, /s, /isU等 都是些什么东西呢? i 匹配大小写 s 模式中的圆点元字符(.)匹配所有的字符,包括换行符 x 模式中的空白字符除了被转义的或在字符类中的以外完 ...
- CVTE实习面经
一个月的实习都结束了,我才把这篇面经放出来...可能有记得不太清楚的地方,还请多多见谅. 第一次面试是在5月中旬. 这次面试问的主要是基础的问题吧,就是C和C++的基础问题,我记得有问到下面几个问题 ...
- android/ios js 启动apk
1.在移动设备访问某个连接时时,如果本地安装了其应用客户端,则浏览器会调用本地客户端,没有安装则会跳转到下载页面,提示安装.刚好有这样的需求,网上参考了其他人的实现,大部分都是关于APK和本地js交互 ...
- iTunes Connect 开发者上手经验(转)
原文:http://www.cnblogs.com/zhw511006/archive/2013/01/15/2860945.html iOS Developer通常需要用到 developer.ap ...
- linux c++循环缓冲区模板类
一:概述 实际学习和工作中,我们经常会遇到读写大量数据的情况,这个时候我们可能就用到了循环缓冲区. 循环缓冲区在处理大量数据的时候有很大的优点,循环缓冲区在一些竞争问题上提供了一种免锁的机制,免锁的前 ...
- centos7.2进入单用户模式
1 - 在启动grub菜单,选择编辑选项启动 2 - 按键盘e键,来进入编辑界面 3 - 找到Linux 16的那一行,将ro改为rw init=/sysroot/bin/sh 4 - 现在按下 Co ...