1.mvc设计模式理解
Model: 模型 持有所有的数据状态和业务逻辑; 泛指数据库,链接数据库,建立数据模型
View: 视图 用来展示数据模型在页面上,泛指前端
Controller: 控制器, 接收用户的数据,进行逻辑处理后,传给model. 泛指后端
优点: 模块化 易复用
 
2.vuex理解 (和本篇无关,只做记录)
vuex是为vue程序开发的状态管理模式,它采用集中式的管理模式存储管理所有组件的状态,并按
照一定的规则保证状态以一种可预测的方式发生变化!
出现原因: 管理不断变化的state非常困难,不可控性; 例如非父子组件传值问题,传值方式繁琐.
使用场景: 中大型单页面应用; 小型应用不使用,显得项目繁琐.
3.MVVM设计模式(vue)的理解
(1)先看下MVC设计模型,view层展示Model层的数据进行渲染页面,Controller层接收用户操作的
数据进行后端的业务处理后,在传递给Model层进行建立数据模型,最后view进行重新请求Model
数据进行更新页面数据.
这种模式的缺点: 1.view -- model层关联密切: view层请求model层数据进行页面渲染;当model层
数据发生变化的时候,view需要再次重新请求model数据进行渲染;...
2.Controller: 接收用户行为,进行逻辑处理后,数据发生改变; 每次改变都要发送给Model层,然后
Model改变,进而view改变.
(2)那可不可以直接view -- model实现自动同步/响应式呢.
这就是MVVM设计模式:
Model: 数据层,泛指数据库
View:视图层,泛指前端
ViewModel:监听模型数据的改变和用户的输入等行为,处理用户的交互逻辑;简单说,就是一个连接
model和view的对象.
view和model是相互独立的,通过vm(viewmodel)这个连接的对象或者说桥梁来实现同步响应式的
变化; 当model发生数据改变,view层会自动同步,同理当view操作数据改变后,model层也会同步!
其实,MVVM设计模式中,只是把controller层弱化了,交给viewmodel处理.这样做的优点:
开发者不用再关心DOM更新同步和状态变化同步到数据库问题. 只需要关心业务逻辑.
而把状态管理交给viewmodel.
MVVM设计模式:实现view model同步的原理:
Object.defineProperty()定义的set和get函数

MVC和MVVM设计模式简单理解的更多相关文章

  1. （一）mvc与mvvm设计模式

    前沿:了解设计模式对我们而言,具有很大意义,对语言没有限制,它适用于任何语言,是一种变成思想.设计模式最初有四人帮提出,有兴趣的同学可以去了解下,今天给大家主要分析mvc与mvvm设计模式 一.mvc ...

  2. MVC模式和MVVM模式简单理解

    相信这是两个耳熟能详的词了,MVC广泛的用到了java的各种框架当中,比如Struts2, SpringMVC等,作为B/S架构开发,MVS模式也是我们必须掌握的. mvc一步一步演化之后有了现在的M ...

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

    一.概述 在 iOS 开发中,MVC(Model View Controller)是构建iOS App的标准模式,是苹果推荐的一个用来组织代码的权威范式.Apple甚至是这么说的.在MVC下,所有的对 ...

  4. [ExtJS5学习笔记]第九节 Extjs5的mvc与mvvm框架结构简单介绍

    本文地址:http://blog.csdn.net/sushengmiyan/article/details/38537431 本文作者:sushengmiyan ------------------ ...

  5. MVC与MVVM设计模式理解

    MVC设计模式(View和Model之间不能直接通信) MVC是一种架构模式,M表示Model,V表示视图View,C表示控制器Controller: Model负责存储.定义.操作数据.从网络中获取 ...

  6. 前端MVC、MVVM的简单实现

    MVC MVC是一种设计模式,它将应用划分为3个部分:数据(模型).展示层(视图)和用户交互层.结合一下下图,更能理解三者之间的关系.换句话说,一个事件的发生是这样的过程 用户和应用交互 控制器的事件 ...

  7. MVC设计模式的简单理解

    MVC介绍 众所周知MVC不是设计模式,是一个比设计模式更大一点的模式,称作设计模式不合理,应该说MVC它是一种软件开发架构模式,它包含了很多的设计模式,最为密切是以下三种:Observer (观察者 ...

  8. Android开发模式之MVC，MVP和MVVM的简单介绍与区别

    相信大家对MVC,MVP和MVVM都不陌生,作为三个最耳熟能详的Android框架,它们的应用可以是非常广泛的,但是对于一些新手来说,可能对于区分它们三个都有困难,更别说在实际的项目中应用了,有些时候 ...

  9. JavaScript设计模式的简单理解

    设计模式可以理解为一系列的代码框架,我觉得主要涉及封装的概念.把实现某一功能的代码段封装在函数中,可以方便调用,同时利于代码的复用,提高了代码的可维护性.下面简单介绍一下几种设计模式的个人感受. 1. ...

随机推荐

  1. 【每日一包0012】to-camel-case,to-no-case,to-space-case

    github地址:https://github.com/ABCDdouyaer/a_pack_per_day_NO.1 to-camel-case 将被其他符号分割的字符串转换为驼峰形式的字符串 用法 ...

  2. 【nginx】 配置域名转发到相同地址不同端口下执行相应业务

    #doctor upstream doc { server 52.**.**.***:8090; } #patient upstream pat { server 52.**.**.***:8088; ...

  3. webConfig的使用

    <sessionState mode="Off|InProc|StateServer|SQLServer" cookieless="true|false" ...

  4. 搭建jenkins集群node结点

    配置结点 首先,需要在jenkins的系统设置中新增一个结点 系统管理 -> 节点管理 -> New Node 配置Remote root directory最好和主jenkins的路径一 ...

  5. MyEclipse下复制的web项目

    MyEclipse下复制的web项目,需要修改MyEclipse->Project Facets->Web

  6. git提交到分支

    git checkout grego@gregoo:mygo$ git checkout origin/test Note: checking out 'origin/test'. You are i ...

  7. [Python]if语句的练习

    习题: 小明身高1.75,体重80.5kg.请根据BMI公式(体重除以身高的平方)帮小明计算他的BMI指数,并根据BMI指数:低于18.5:过轻 18.5-25:正常 25-28:过重 28-32:肥 ...

  8. rocketMQ broker 分发并处理请求

    使用 netty 监听端口 // org.apache.rocketmq.remoting.netty.NettyRemotingServer#start ServerBootstrap childH ...

  9. select框动态添加选项

    $.ajax({ url : "${staticServer }/ywgl/zkpzgl/zkfkgl/showBillType.htm", //ajax请求路径 type : & ...

  10. 【图形学手记】Inverse Transform Sampling 逆转换抽样

    需求: 我们通过调查,得知大多数人在20岁左右初恋,以20岁为基准,以随机变量X表示早于或晚于该时间的年数,为了简单,假设X值域为[-5,5],并且PDF(X)是一个正态分布函数(当然可以为任意分布, ...