• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

Ext.js Class 系统

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

Ext JS 是一个 JavaScript 框架,它具有面向对象编程的功能。
Ext 是封装 Ext JS 中所有类的命名空间。 

在 Ext JS 中定义类

Ext 提供了 300 多个类,我们可以用于各种功能。

Ext.define()用于在 Ext JS 中定义类。

语法:

Ext.define(class name, class members/properties, callback function);

类名称是根据应用程序结构的类名称。 appName.folderName.ClassName
studentApp.view.StudentView。

类属性/成员 - 定义类的行为。

回调函数是可选的。 当类正确加载时,会调用它。

Ext JS 类定义示例

Ext.define(studentApp.view.StudentDeatilsGrid, {
   extend : 'Ext.grid.GridPanel',
   id : 'studentsDetailsGrid',
   store : 'StudentsDetailsGridStore',
   renderTo : 'studentsDetailsRenderDiv',
   layout : 'fit',
   columns : [{
      text : 'Student Name',
      dataIndex : 'studentName'
   },{
      text : 'ID',
      dataIndex : 'studentId'
   },{
      text : 'Department',
      dataIndex : 'department'
   }]
});

创建对象

像其他基于 OOPS 的语言一样,我们也可以在 Ext JS 中创建对象。

不同的方式创建对象在 Ext JS。

使用 new 关键字:

var studentObject = new student();
studentObject.getStudentName();

使用 Ext.create():

Ext.create('Ext.Panel', {
   renderTo : 'helloWorldPanel',
   height : 100,
   width : 100,
   title : 'Hello world',
   html : 	'First Ext JS Hello World Program'		
});

Ext JS 中的继承

继承是将类 A 中定义的功能用于类 B 的原理。

在 Ext JS 继承可以使用两种方法 。

Ext.extend:

Ext.define(studentApp.view.StudentDetailsGrid, {
   extend : 'Ext.grid.GridPanel',
   ...
});

这里我们的自定义类 StudentDetailsGrid 使用 Ext JS 类 GridPanel 的基本功能。

使用 Mixins:

Mixins 是在没有扩展的情况下在类 B 中使用类 A 的不同方式。

mixins : {
   commons : 'DepartmentApp.utils.DepartmentUtils'
},

Mixins 我们添加在控制器中,我们声明所有其他类,如存储,视图等。在这种方式,我们可以调用 DepartmentUtils 类,并在控制器或在这个应用程序中使用其功能。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
Ext.js 集装箱发布时间:2022-01-29
下一篇:
Ext.js 第一个程序发布时间:2022-01-29
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap