Ext js-02 -官方API文档使用

最新推荐文章于 2024-07-29 17:49:33 发布

weixin_30763397

最新推荐文章于 2024-07-29 17:49:33 发布

阅读量442

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/enjoyjava/p/8976787.html

版权

本文详细介绍了如何使用Ext JS的官方API文档，包括如何选择版本、使用搜索功能，以及理解组件的单例对象、配置项、属性、方法和事件。以Ext.MessageBox为例，阐述了configs、properties、methods和events的用法，同时展示了多种创建组件的方式，并通过实例演示了事件监听的实现。

摘要由CSDN通过智能技术生成

官方API文档地址：

http://docs.sencha.com/extjs/6.5.3/classic/Ext.html

打开网页如下：

1.选择所使用的Ext js版本，后面offline docs是离线文档的下载

2.搜索功能：查找类，组件等

需要注意这个API下面modern是手机端对应的组件，classic对用的是电脑端的组件的介绍

例子：搜索messagebox,选择第二个Ext.window.MessageBox，打开如下：

3.看懂API对组件的介绍：如单例对象，组件类，xtype，config配置，properties配置，methods方法，events事件，继承体系等

（1）单例对象与组件类：

点击左侧的Ext ,在显示的界面上会看到一个SINGLETON的标识，表示这是一个单例对象（注意，单例对象前面显示的是红色的图标），在整个应用当中，只有一个Ext对象，

下边configs,properties，methods是这个单例对象具有的一些属性，方法等

搜索messagebox时，会出现Ext.window.MessageBox，和Ext.MessageBox，后者是一个单例对象，如上图，而Ext.window.MessageBox是一个组件（每一个组件都是一个类），Ext.window.MessageBox 指明了 Ext.MessageBox这个对象所属的类是哪一个类，xtype 相当于一个别名，方便使用。

（2）configs 的使用，先关注一下类搜索和成员搜索的区别，是不同的搜索框

以Ext.MessageBox为例

上边fn就是alert方法的回调函数，也就是alert方法执行完后再执行的函数，scope是回调函数执行的范围，以例子说明如下：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>ext js入门</title>
 6     <!-- 引入ext js 的样式文件-->
 7     <link rel="stylesheet" type="text/css" href="ext/classic/theme-triton/resources/theme-triton-all.css" />
 8     <!-- 引入ext js的核心库-->
 9     <script src="ext/ext-all.js"></script