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>

好的工具真的是事半功倍。

时间: 2024-10-13 02:22:22

mvvm的优势的相关文章

ReactiveCocoa & MVVM 学习总结二

二. MVVM 1. 什么是MVVM From: https://github.com/ReactiveCocoa/ReactiveViewModel#model-view-viewmodel MVVM是指 Model-View-ViewModel的简称,与MVC的一个主要区别是 view 拥有view model.这个与MVC不一样,MVC中应该是controller拥有view.同时,view model 中应该不包含相关view的代码,这样以来,view model就是独立的,可以与任何v

谈MVVM

什么是MVVM? MVVM(模型-视图-视图模型,Model-View-ViewModal)是一种架构模式,并非一种框架,它是一种思想,一种组织与管理代码的艺术.它利用数据绑定,属性依赖,路由事件,命令等特性实现高效灵活的架构 一个事件发生的过程: 1.用户在视图 V 上与应用发生交互 2.VM 触发相应的事件,VM从模型 M 中请求到用户需要的数据,并立马反馈回视图 3.视图 V 更新数据,展现给用户 Mvvm的核心是数据驱动,实际开发中,只要预先写好view和model的关系映射(viewm

iOS——MVVM设计模式

一.典型的iOS构架——MVC 在典型的MVC设置中,Model呈现数据,Vie呈现用户界面,而ViewController调节它两者之间的交互. 虽然View和View Controller是技术上不同的组件,但他们总是手牵手在一起,成对的,View不能和不同的View Controller配对,反之亦然.View和View Controller之间的关系如下图所示: 在典型的MVC应用里,许多逻辑被放在ViewController里.它们中的一些确实属于View Controller,但更多

Android官方MVVM框架实现组件化之整体结构

一.google官方MVVM框架讲解 我前面对比了MVC和MVP<两张图看懂Android开发中MVC与MVP的区别>,可以相对于MVC我们的MVP是有多优越,但是Android开发现在已经开始流行了MVVM,前不久google官方发布了MVVM的正式库.官方的正式MVVM库主要包括下面四个: 其中只有ViewModel是MVVM结构中的一个组件,其他的三个都是辅助性质的. lifecycles 就是处理UI界面的生命周期,在26版本以后的Support库中,AppCompatActivity

iOS 关于MVC和MVVM设计模式的那些事

一.概述 在 iOS 开发中,MVC(Model View Controller)是构建iOS App的标准模式,是苹果推荐的一个用来组织代码的权威范式.Apple甚至是这么说的.在MVC下,所有的对象被归类为一个Model,一个View,和一个Controller.Model持有数据,View显示与用户交互的界面,而ViewController调解Model和View之间的交互.现在,MVC 依然是目前主流客户端编程框架,但同时它也被调侃成Massive View Controller(重量级

iOS面试题:MVVM和MVC的区别

MVVM和MVC的区别 1. MVC MVC的弊端 厚重的View Controller M:模型model的对象通常非常的简单.根据Apple的文档,model应包括数据和操作数据的业务逻辑.而在实践中,model层往往非常薄,不管怎样,model层的业务逻辑不应被拖入到controller. V:视图view通常是UIKit控件(component,这里根据习惯译为控件)或者编码定义的UIKit控件的集合.View的如何构建(PS:IB或者手写界面)何必让Controller知晓,同时Vie

一篇文章,带你玩转MVVM,Dapper,AutoMapper

一.背景 由于现在做的项目都是采用WPF来进行UI设计,开发过程中都是基于MVVM来进行开发,但是项目中的MVVM并不是真正的把实体和视图进行解耦,而是将实体和视图完全融合起来,ViewModel只是用来实现View和Model的数据同步,违背了MVVM设计的数据双向绑定的初衷,完全没有发挥出MVVM的优势. 二.MVVM基本概念 1.M:表示Model,也就是一个实体对象. 2.V:表示VIew,也就是UI界面展示,即人机交互界面. 3.ViewModel:可以理解为搭建View和Model的

企业级架构 MVVM 模式指南 (WPF 和 Silverlight 实现) 译(2)

本书包含的章节内容 第一章:表现模式,以一个例子呈献给读者表现模式的发展历程,我们会用包括MVC和MVP在内的各种方式实现一个收费项目的例子.沿此方向,我们会发现每一种模式的问题所在,这也是触发设计模式发展的原因.本章还会说明如果应用不当,MVC和MVP这些依赖.Net事件的表现模式是怎么导致内存泄漏的.本章会谈论各种表现模式的优缺点,并且留给读者自我思考的问题,如为什么用MVVM设计模式来代替MVP或是MVC.第二章:介绍MVVM,包括使MVVM魅力四射的WPF和Silverlight的各种特

MVVM大比拼之vue.js源码精析

VUE 源码分析 简介 Vue 是 MVVM 框架中的新贵,如果我没记错的话作者应该毕业不久,现在在google.vue 如作者自己所说,在api设计上受到了很多来自knockout.angularjs等大牌框架影响,但作者相信 vue 在性能.易用性方面是有优势.同时也自己做了和其它框架的性能对比,在这里.今天以版本 0.10.4 为准 入口 Vue 的入口也很直白: ? 1 var demo = new Vue({ el: '#demo', data: { message: 'Hello V