`
czpae86
  • 浏览: 720243 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

第三章 Extjs在开发中如何实现代码复用 (入门教程)

EXT 
阅读更多

第三章 Extjs在开发中如何实现代码复用 (入门教程)

 

如果要实现如下界面,你会选择那种代码?

 


 

代码1:



 

 

代码2:


 

 


 根据上面创建对象:



 

 

 

你会选择那种??建议选择代码2方式(或者参考我的另一篇文章的写法 一个Ext继承例子(下拉tree、grid、panel、form等组件的基类))!

 

因为这样可以实现代码复用,举个简单的例子,如果要做一个新增、修改的表单,可能你要copy两份代码,这样不利于维护,如果按照代码2的方式写,那么只要如下创建新增、修改的表单:

 

新增表单:

var addForm = new Register.MicWin({
       title : "新增",
       buttons : [{text:"保存"},{text:"取消"}]
}).show();

 

 

修改表单:

var editForm = new Register.MicWin({
       title : "修改",
       buttons : [{text:"保存"},{text:"取消"}]
}).show();

 

 

 

运行效果图:



 

  • 大小: 13.5 KB
  • 大小: 58.7 KB
  • 大小: 60 KB
  • 大小: 9.2 KB
  • 大小: 26.3 KB
分享到:
评论
7 楼 czpae86 2010-04-19  
joehe 写道
哪种方式都不用,这样用ext越用越累赘

请问那种方式?请指教!
这样用ext越用越累赘??累赘是指?
6 楼 czpae86 2010-02-18  
lishuanglin52130 写道
思维不错,但是太死板了,比如:我添加少个字段,就不行.....


少了字段就加嘛,只加一个地方就可以了。。。。
5 楼 lishuanglin52130 2010-02-12  
思维不错,但是太死板了,比如:我添加少个字段,就不行.....
4 楼 fnet 2010-02-09  
尽量标准化设计功能所需要的组件吧。

但即便是这样,有时也显得累赘:

比如一般一个功能打开后的界面:

上面一搜索
搜索下面是菜单:新增、修改、删除
最下面是个Grid

这里面至少涉及到:三个form window,一个grid 等等。。

这三个form有相同的属性,如果不重用,整个js就非常之长也显得累赘。。。
3 楼 smilebug 2010-02-09  
在extjs官网上有好几种方式实现继承,这只是其中一种

至于有没有必要就看需求了,LZ这样写得太死了,除非系统里要用到N多次这种重复的东西。如果整个系统只出现一、两次的组件都这样整会麻烦死的。

以前扩展Ext组件,一般都是把一些类似于grid,tree等组件要由view,store, reader, proxy这些东东组成(人家为了分层嘛),设计是好的,但是系统里每次grid都写好几个东东就太麻烦,所以就扩展了一些自己的grid。个人感觉这样的意义会大一点。
2 楼 joehe 2010-02-09  
哪种方式都不用,这样用ext越用越累赘
1 楼 liuzk86 2010-02-06  
不错啊。看起来简单了很多..

相关推荐

    ExtJS快速入门 ExtJS快速入门 ExtJS快速入门

    ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS...ExtJS快速入门 ExtJS快速入门 ExtJS快速入门ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门 ExtJS快速入门

    ExtJS入门教程(超级详细)

    在ExtJS入门教程中,首先需要掌握的是如何获取ExtJS库文件。用户可以通过ExtJS官方网站提供的下载链接获取到最新的ExtJS库文件,下载的文件是一个压缩包,解压后可以看到包含的文件和目录。其中主要的文件包括...

    extjs插件开发教程

    在ExtJS中,插件通常是一个实现了`Ext.AbstractPlugin`接口的类。你需要定义一个类,并在类中声明`ptype`属性,以便于在配置中引用这个插件。例如: ```javascript Ext.define('MyPlugin', { extend: 'Ext....

    extjs入门教程及ext3.0开发文档

    本教程将深入探讨ExtJS的基础知识及其在Ext3.0版本中的特性。 首先,让我们从“ExtJS入门教程(超级详细).pdf”开始。这个教程为初学者提供了全面的指导,涵盖了ExtJS的核心概念,包括组件系统、布局管理、数据绑定...

    Extjs4.0学习手册、入门教程详解学习

    Extjs4.0学习手册、入门教程详解学习 Extjs4.0学习手册、入门教程详解学习 Extjs4.0学习手册、入门教程详解学习

    EXTJS实用开发指南和官方中文教程

    EXTJS实用开发指南和官方中文教程

    在Eclipse中开发Extjs4代码

    `在Eclipse中开发Extjs4代码.mp4`是一个高清视频教程,可能涵盖了如何配置Eclipse环境,安装Spket插件,导入jsb文件,以及在Eclipse中创建和调试ExtJS4项目的具体步骤。通过观看这个教程,初学者可以直观地学习到...

    EXTJS入门教程(非常详细)

    在本入门教程中,还包含了简单的示例代码,这些示例代码将演示如何使用ExtJS来创建一个基础的“Hello World”应用程序。这个过程包括了如何设置HTML页面,如何引入必要的ExtJS库文件,以及如何编写JavaScript代码来...

    extJs4.0 开发手册源码

    "Extjs4.0 Web应用开发指南(第二版)-源代码"这本书的源码部分,不仅提供了EXTJS4.0的源代码,还提供了书中实例的实现,这对于学习EXTJS4.0的实际开发流程非常有帮助。通过对照书中的讲解和源码,开发者可以更深入地...

    EXTJS4.0视频教程配套代码包含action类

    EXTJS4.0是一款强大的JavaScript框架,用于构建富客户端Web应用程序。...通过这个视频教程配套代码,你不仅可以巩固EXTJS的基础知识,还能学习到如何解决实际开发中遇到的问题,提升EXTJS应用的开发能力。

    ExtJs4.0入门教程

    ExtJs4.0入门教程,详细介绍ExtJs4.0。

    EXTJS4.0视频教程配套代码

    第三讲:extjs4.0数据模型--Model(附件较大做了分包压缩大家只要下载2个包运行001就ok了) [03]EXTJS4.0数据模型-Model.001.zip (70.00M)[03]EXTJS4.0数据模型-Model.002.zip (57.37M) 第四讲:extjs4.0的数据代理-...

    ExtJS入门教程(超级详细).pdf

    ExtJS入门教程(超级详细).pdf

    EXTJS4.2学习入门教程

    EXTJS4.2学习入门教程 EXTJS4.2学习入门教程 EXTJS4.2学习入门教程

    ExtJS2.0简明教程

    教程包括ExtJS 的新手入门、组件体系结构及使用、ExtJS 中各控件的使用方法及示例应用等,是一个非常适合新手的ExtJS 入门教程。本教程主要是针对ExtJS2.0 进行介绍,全部代码、截图等都是基于ExtJS2.0。

    ExtJs实用开发指南

    ExtJs实用开发指南是新手入门extjs的非常棒的资料

    《Extjs Web应用程序开发指南》代码(全)

    - chapter03.rar可能包含第3章的代码示例,涵盖了基础组件的使用,如按钮、标签、字段等,以及布局管理的基本概念。 - chapter04.rar可能涉及更复杂的组件,如表格、树形视图或表单,以及如何使用Store管理数据。 - ...

    Extjs5.0从入门到实战开发信息管理系统

    本教程旨在帮助初学者掌握ExtJS 5.0,并通过实战开发信息管理系统,将理论知识与实际应用相结合。 首先,我们要了解ExtJS的基础知识。这包括学习ExtJS的架构、事件模型、布局管理、组件系统以及数据绑定。在ExtJS中...

    EXTJS实用开发指南中文英文教程

    EXTJS实用开发指南中文英文教程 EXTJS实用开发指南中文英文教程 EXTJS实用开发指南中文英文教程 EXTJS实用开发指南中文英文教程

    ExtJS入门教程.pdf

    ExtJS入门教程 一、开始EXTJS 二、组件的介绍 三、EXT核心

Global site tag (gtag.js) - Google Analytics