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. AllPay(欧付宝)支付接口集成

    AllPay,http://www.allpay.com.tw/,欧付宝是台湾知名的第三方支付公司,拥有丰富的支付模式(支持和支付宝.财付通),只需要一次对接,各种支付模式均可使用. 接口编写SDK: ...

  2. java之Pattern类详解

    在JDK 1.4中,Java增加了对正则表达式的支持. java与正则相关的工具主要在java.util.regex包中:此包中主要有两个类:Pattern.Matcher. Pattern  声明: ...

  3. Halcon 1D测量

    1.产生测量句柄,准备提取与矩形(圆弧)主轴垂直的值边缘. gen_measure_rectangle2或gen_measure_arc 2.测量边缘对   ,测量的直线与矩形或者圆弧垂直 measu ...

  4. shell脚本介绍
 shell脚本结构和执行
date命令用法
 shell脚本中的变量

  5. HTTP Status 500 - Could not open Hibernate Session for transaction;

    错误原因: mysql数据库没有连接上 我们来启动mysql 方法1: 管理员身份运行 cmd 输入:  net start mysql 方法2: Windows + R 运行 services.ms ...

  6. 使用 ssh -R 穿透局域网访问内部服务器主机,反向代理 无人值守化

    一.搭建SSH方向代理 准备: 局域网主机(虚拟主机): 192.168.6.233   CentOS 6.7 阿里云服务器:120.25.68.60   CentOS 6.7 1. 阿里云服务器12 ...

  7. iOS开发之--cocopods相关问题及解决方法

    Note: as of CocoaPods 1.0, `pod repo update` does not happen on `pod install` by default 解决办法:删除工程中的 ...

  8. php MongoDB driver 查询实例

    //是否只查mx $mx_on_switch = I("post.mx_on_switch"); //mx模糊查询 $mx_vague_check = I("post.m ...

  9. Jenkins和Sonar集成

    Jenkins可以通过插件的形式和Sonar很好的集成. (1)Jenkin安装Sonar插件(这里我估计安装的插件有点多) 注意:之前安装Jenkins的时候我用的是JDK系统环境环境变量jdk1. ...

  10. python3之深浅拷贝

    深浅copy 1,先看赋值运算. l1 = [1,2,3,['barry','alex']] l2 = l1 l1[0] = 111 print(l1) # [111, 2, 3, ['barry', ...