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. Redmine新建问题速度慢

    Redmine有时候新建问题 ,更新指派人的时候反应很慢, 很大原因应该是发送邮件方式不对. 1.一种方式是改为异步发送      2.另外检测到Redmine日志 ,会发现发送邮件失败 ,也会导致发 ...

  2. leetcode 155

    题目描述: Design a stack that supports push, pop, top, and retrieving the minimum element in constant ti ...

  3. j2ee部分

    j2ee部分 1.BS与CS的联系与区别. C/S是Client/Server的缩写.服务器通常采用高性能的PC.工作站或小型机,并采用大型数据库系统,如Oracle.Sybase.InFORMix或 ...

  4. DB2 常用命令小结

    . 打开命令行窗口 #db2cmd . 打开控制中心 # db2cmd db2cc . 打开命令编辑器 db2cmd db2ce =====操作数据库命令===== . 启动数据库实例 #db2sta ...

  5. Oracle EBS FND User Info API (转) EBS用户账号密码职责相关

    . 与用户信息相关API PKG. --和用户处理有关的API FND_USER_PKG; --和用户密码处理有关的API FND_WEB_SEC; --和用户职责处理有关的API FND_USER_ ...

  6. html5,格式的验证

    <form action="" method="get">    <input type="text" name=&quo ...

  7. 关于oracle中in和exists的区别

    一般来说,这两个是用来做两张(或更多)表联合查询用的,in是把外表和内表作hash 连接,而exists 是对外表作loop 循环,假设有A.B两个表,使用时是这样的: 1.select * from ...

  8. Web Word和Excel

    暂时收集点资料备用 Excel http://www.cnblogs.com/downmoon/archive/2011/05/30/2063258.html http://www.cnblogs.c ...

  9. 【实践】js 如何实现动态添加文本节点

    对于我这个js 小白来说 今天鼓起勇气做起了邮箱认证这个特效 但是这次不是想说如何实现这这个特效而是想记录一下特效当中的某个部分 那就是向元素节点动态添加文本节点 百度了一下动态添加文本节点的方式 是 ...

  10. 7.Git的版本退回

    现在,你已经学会了修改文件,然后把修改提交到Git版本库,现在,再练习一次,修改readme.txt文件如下: Git is a distributed version control system. ...