Extjs MVC学习随笔01

2018-06-18 04:32:42来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

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没写错,那么数据就会出现了:

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

 

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

  —————— 给自己

  

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:Jquery 全选、反选问题的记录

下一篇:【神器】vimum在浏览器中键盘操作选择、复制、粘贴,键盘党的最