Extjs Mvc模式下的整个MVC框架体系即下图:

包含了Controller(实现方法层),Store(数据来源管理层),View(页面布局层)。之所以用MVC我想是因为减轻针对某一页面的单一的JS 的开发,为啥呢,可以看一下没有使用MVC模式的Extjs 的编码:

(因为我也是新手,所以可能里面的代码有点儿冗杂)

仅仅是一个页面,代码量已经上了千行以上,可想而知,对于功能复杂的页面如果用单一的Extjs UI开发的话 代码量肯定可烦人(最主要是翻来翻去的,鼠标滚轮都烦了...)。而且如果你写完这个页面,其他的页面也有相同功能的组件的话,你是不是又要重新Copy然后在写一遍重复的代码呢.... 那样也就贼恶心了。

一:视图的创建:

就像目前本人所做的项目:一个互联网医疗项目,整体就是采用的Extjs MVC模式,如果自己创建一个组件的话我们可以给其一个“xtype”:,然后在需要调用该组件或者页面的页面只需要在items里面配置所有项的时候将其写为:{xtype:'...'}就可以将该组件拿出来使用了,当然还需要注意的是必须要在组件创建页里就是上图上有一个"requires"属性,在这里需要将所有引用该组件的页面的路径写上去,然后引用页才可以调用该组件。

二:控制器:

如果我们某一个搜索按钮有一个handler的话,我们可以将该方法写到控制器里面去,如:

这里面的“onSearch”就是一个方法,而该方法则是在控制器里面的专一的JS文件里面写着

当然这里也有一个需要注意的:我们需要指定controller的位置,这个属性也是在视图页面配置的:

三:数据来源store

这里面用的是defin,自定义的store,给了一个ID,与一个别名

其他的页面在调用这个数据源的时候就可以这样使用了:

其中type 对应的就是store里的别名“alias”属性,storeid就不用说了,这样只要ashx没写错,那么数据就会出现了:

当然具体里面还有好多更深的用法,本人也是菜鸟一个,只能慢慢学习喽  —.—  。

坚持就是收获,一口吃不成胖子,记下生活学习的点点滴滴进步,再回首,怎么地也是一笔财富。

—————— 给自己

Extjs MVC学习随笔01的更多相关文章

  1. ExtJS MVC学习手记 1

    开发环境: ExtJS4.2 eclipse indigo 开发目标  搭建项目框架,创建viewport 开发步骤说明 这次主要使用extjs4的mvc模式创建viewport.籍此初步了解mvc模 ...

  2. ExtJS MVC学习手记

    开始学习ExtJS的MVC了.这篇文章仅是用来做一个目录,为自己这个阶段的学习内容做个索引. 手记涉及的文章: EXTJS MVC结构(译自ExtJS4.0文档中的<MVC Architectu ...

  3. ExtJS MVC学习手记 2

    开发环境 eclipse(indigo) ExtJS4.0 开发目标 使用store.model和controller创建菜单树 开发步骤 之前我们已经建立了一个MVC的项目框架.现在要做的就是在这个 ...

  4. 【MVC学习笔记01】初窥奥秘

    前言 最近工作落实了,是我非常喜欢的无线前端,会接触很多新东西啦,需要努力才行.因为会用到backbone,所以要学习MVC啦. MVC(模型-视图-控制器),这种模式最早被用于构建桌面程序和服务器端 ...

  5. ExtJS MVC 学习手记3

    在演示应用中,我们已经创建好了viewport,并为之添加了一个菜单树.但也仅仅是这样,点击树或应用的其他地方获得不到任何响应.这个演示应用还是一个死的应用. 接下来,我们让这个应用活起来. 首先,给 ...

  6. MVC学习笔记-01

    什么是MVC MVC是指(Model-View-Controll即模型-视图-控制器)用于表示表示一种软件架构模式,它把软件分成三个基本的部分:模型(Model),视图(view),控制器(Contr ...

  7. MVC 学习随笔(一)

    Model的绑定. (一)使用NameValueCollectionValueProvider C# 对NameValueCollectionValueProvider的支持是通过下面的类实现的 // ...

  8. MVC学习随笔----如何在页面中添加JS和CSS文件

    http://blog.csdn.net/xxjoy_777/article/details/39050011 1.如何在页面中添加Js和CSS文件. 我们只需要在模板页中添加JS和CSS文件,然后子 ...

  9. Spring MVC学习笔记 01

    applicationcontext.xml的配置 <?xml version="1.0" encoding="UTF-8" ?> <bean ...

随机推荐

  1. java中一些定时器的使用

    一:简单说明 ScheduleExecutorService接口中有四个重要的方法,其中scheduleAtFixedRate和scheduleWithFixedDelay在实现定时程序时比较方便. ...

  2. win7怎么彻底关闭全/半角转换快捷键? imetool.exe

    from:http://bbs.csdn.net/topics/370040889 全半角转换最tm的烦人,快捷键是shift+space,不小心按到,就各种不爽, 系统看着是可以重新设置快捷键的,但 ...

  3. RabbitMQ系列之Centos 7安装RabbitMQ 3.6.1

    1.安装EPEL-7: rpm -ivh http://dl.fedoraproject.org/pub/epel/7/x86_64/e/epel-release-7-5.noarch.rpm 2.安 ...

  4. 用于基于 RPM 的 Linux 平台的 Java

    成为超级用户,方法是运行 su 并输入超级用户口令. 卸载任何之前安装的 Java 程序包. rpm -e package_name 切换到所需的安装目录.键入:cd directory_path_n ...

  5. node.js 入门实例【转】

    第1章 一个简单的博客 nswbmw edited this page 14 days ago · 38 revisions Pages 29 Home FAQ 番外篇之——使用 _id 查询 番外篇 ...

  6. CentOS-7下安装MySQL5.6.22

    参考: http://www.2cto.com/database/201501/371451.html 安装环境   CentOS版本:CentOS-7 因为之前安装过,没有成功,但是有之前安装的文件 ...

  7. 最新一代文件结构 超高性能解析IP数据库 qqzeng-ip.dat

    高性能IP数据库格式 qqzeng-ip.dat 编码:UTF8           字节序:Little-Endian 返回多个字段信息(如:亚洲|中国|香港|九龙|油尖旺|新世界电讯|810200 ...

  8. linux 下链接无线网络

    无线网卡配置此页由Linux Wiki用户Chenxing于2008年11月27日 (星期四) 09:28的最后更改. 在1233456的工作基础上.本文介绍在Linux命令行界面中手动配置无线网卡的 ...

  9. Upnp资料整理

    系统,软件和路由器都要打开upnp功能. windows7下,分别启动 function discovery resources publication; Upnp device host; SSDp ...

  10. 鸟哥的linux私房菜学习记录之软件安装原始码与Tarball