1.Ext.js的mvc开发模式

  在ext.js4.0以后引入mvc开发模式,将js分成model-view-controller三层,使得大量js代码变得更加易于维护和重用,这就是ext.jsmvc模式的初衷。

2.ext.js文件夹模式

  1>controller:所有的控制器

  2>view:所有的视图组件

  3>store:所有的储存数据源组件

  4>model:所有的数据模型组件

  5>自己定义组件和工具:data/lib/util

  view中会有一个viewport.js,这个东西就像一个骨架一样,上面可以拼装各种view,具体的说,就是各种布局形式和窗体控件,view界面的载体,一个页面只能有一个viewport。

  view是纯粹的界面组件(比如form ,grid ,window),通过store来加载数据并展示到界面上,界面控件的响应都写在controller里面,view对controller的存在一无所知,也没有代码上的依赖。

  controller的角色完全是个粘合剂,它在加载之初,会帮忙加载跟其有关的model,store,view类,而其真正的作用,是通过一系列的事件处理函数,确定每个view上面界面组件对用户交互行为的响应方法,可以说是一堆事件处理器函数的集合,这里面主要通过一个control成员函数来进行事件绑定,通过另一个叫componentquery的组件,使用类似css selector的语法来定位界面上的组件,并为其绑定事件处理器。

  Model是对抽象数据的具体化,简单理解就是数据库里面的一行记录。

  Store是对通过网络加载数据的过程的一个抽象,Store通过data发送请求(一般为ajax请求)到后台获取数据(一般返回json格式),Store依赖于Model,通过关联的Model对象才知道如何将取回的数据对象化。

3.ext.js的开发环境

  功能:加载样式表、核心库,app.js

  <script type="text/javascript" src="include-ext.js"></script>
  <script type="text/javascript" src="all-classes.js"></script>
  <script type="text/javascript" src="app.js"></script> app.js中加载单页面的唯一入口Ext.container.Viewport ,进入view,在加载控制器文件controllers

 

controller 控制器中加载各种组件---各种js文件(自己编写的js文件),但不加载Viewport组件。

当autoCreateViewport设置为true时表示框架自动创建Viewport组件。

 
  

ext.js的mvc的更多相关文章

  1. ext.js的mvc开发模式详解

    ext.js的mvc开发模式详解和环境配置 在JS的开发过程中,大规模的JS脚本难以组织和维护,这一直是困扰前端开发人员的头等问题.Extjs为了解决这种问题,在Extjs 4.x版本中引入了MVC开 ...

  2. Ext.js 之MVC

    Ext.js 4.0之MVC

  3. [Ext JS 4] MVC 应用程序框架

    前言 大型客户端应用程序总是很难编写,很难组织和很难维护.随着功能的增加和更多的开发人员加入项目,对项目的控制也越来越困难了.Ext JS 4 提供了一个新的应用程序框架帮助组织代码. 模型 - 一组 ...

  4. 2017年第1贴:EXT.JS使用MVC模式时,注意如何协调MODEL, STORE,VIEW,CONTROLLER的关系

    也调了快一天,死活找不到窍门. MODEL, STORE,VIEW的调置测试了很久,试了N种方法,不得其果. 最后,试着在APPLICATION里加入CONTROLLER, 在CONTROLLER里加 ...

  5. 【翻译】对于Ext JS 5,你准备好了吗?

    原文:Are You Ready for Ext JS 5? Ext JS 5:准备升级 对于Ext JS 5加入Sencha的大家庭,我们感到非常高兴!作为一个主要版本,在Ext JS 5引入了一堆 ...

  6. 新书《Ext JS 4.2实战》即将出版

    目录: 第1章    Ext JS 4概述1.1    从Ext JS 4.0到4.071.2    从4.1到4.1.1a1.3    从4.2到4.2.11.4    如何选择版本1.5    基 ...

  7. Ext.js细节:在MVC中处理Widget Column,GetCmp和ComponentQuery, Id和ItemId

    针对EXT.JS版本的演进,要不断的学习新的最佳实践方法. 比如,在定义组件时,尽管用itemid,而不是id. 在搜索组件时,尽量用ComponentQuery,而不是getCmp. 在MVC中处理 ...

  8. 【转】EXT JS MVC开发模式

    原文链接:EXT JS MVC开发模式 在app(亦即根目录)文件夹下面创建controller.model.store和view文件夹,从名称上就知道他们该放置什么代码了吧.然后创建Applicat ...

  9. sencha ext js 6 入门

    Sencha Ext JS号称是目前世界上最先进和最强大的.支持多平台多设备的JavaScript应用程序开发框架.首先看一下Ext JS的发展简史. 1 Ext JS发展简史 YUI-Ext的作者J ...

随机推荐

  1. java.lang.String.regionMatches方法使用

    regionMatches(boolean ignoreCase,int toffset,String other,int ooffset,int len): regionMatches(int to ...

  2. html 用一个frame刷新另一个frame(同一个Frameset中)

    假设主页面index.html,其中frameset结构如下所示: <html> <head> <meta http-equiv="Content-Type&q ...

  3. Scala学习笔记(六):本地函数、头等函数、占位符和部分应用函数

    本地函数 可以在方法内定义方法,这种方法叫本地函数,本地函数可以直接访问父函数的参数 def parent(x: Int, y: Int): Unit ={ def child(y:Int) = y ...

  4. [TensorBoard] Name & Variable scope

    TF有两个scope, 一个是name_scope一个是variable_scope 第一个程序: with tf.name_scope("hello") as name_scop ...

  5. [IR] Concept Search and PLSA

    [Topic Model]主题模型之概率潜在语义分析(Probabilistic Latent Semantic Analysis) 感觉LDA在实践中的优势其实不大,学好pLSA才是重点 阅读笔记 ...

  6. 网络编程 -- RPC实现原理 -- NIO单线程

    网络编程 -- RPC实现原理 -- 目录 啦啦啦 Class : Service package lime.pri.limeNio.optimize.socket; import java.io.B ...

  7. 【中间件安全】Weblogic 安全加固规范

    1. 适用情况 适用于使用Weblogic进行部署的Web网站. 2. 技能要求 熟悉Weblogic安装部署,熟悉Weblogic常见漏洞利用方式,并能针对站点使用Weblogic进行安全加固. 3 ...

  8. sklearn中的回归器性能评估方法

    explained_variance_score() mean_absolute_error() mean_squared_error() r2_score() 以上四个函数的相同点: 这些函数都有一 ...

  9. WMware 安装 Mac OSX

    1,下载unlock.zip工具,破解VMware没有mac选项情况 2. 下载OS X 10.11.1(15B42).cdr 3.MWare虚拟机提示:“锁定文件失败,打不开磁盘或快照所依赖的磁盘” ...

  10. 夺冠概率|2012年蓝桥杯B组题解析第九题-fishers

    (17')夺冠概率 足球比赛具有一定程度的偶然性,弱队也有战胜强队的可能. 假设有甲.乙.丙.丁四个球队.根据他们过去比赛的成绩,得出每个队与另一个队对阵时取胜的概率表: 甲 乙 丙 丁 甲 - 0. ...