晚上看书的感悟：学习转化为能力的过程：学习-复习-体会-实践-理解-能力。不要以为自己够聪明，其实学习只能记住20%，复习记住30%，体会得到40%，实践得出50%，理解得到60%，理解了70%后转换为能力的才有80%。智慧才是力量，因为智慧对行动的影响更大。将知识变成智慧地过程常常是一个痛苦的过程。
好了，言归正传，我们开始学习ExtJS4.2需要的JS包可以从官网下载，这里不多说。这里为什么先说数据基本方式，不要觉得无聊，因为只有这些最重点弄懂了，其他的一些属性用到的时候查下就好了。
1、创建一个新类
好了，言归正传，我们开始学习ExtJS4.2需要的JS包可以从官网下载，这里不多说。这里为什么先说数据基本方式，不要觉得无聊，因为只有这些最重点弄懂了，其他的一些属性用到的时候查下就好了。
1、创建一个新类
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
//demo 01
Ext.define(
'demo.Demo'
,{
name:
'ThinkDiary'
,
hello:
function
(){
return
'Hello'
+
this
.name;
}
});
//demo 02
Ext.define(
'demo.DemoWindow'
,{
extends:
'Ext.Window'
,
title:
'demo hello'
,
initComponent:
function
(){
//初始化
Ext.apply(
this
,{
//将一批属性复制给当前对象
items:[{
html:
'panel1'
},{
html:
'panel2'
}]
});
this
.callParent();
//快捷调用父类函数
},
mixins:[
'demo.Demo'
],
//多重继承
config:{
//辅助功能属性
title:
'demo'
},
statics:{
//定义静态成员
TYPE_DEFAULT:0
},
constructor:
function
(){
//自定义初始化构造函数，先执行此再执行initComponet
//do something init
}
});
|
我们在外部可以这样调用new demo.DemoWindow();
这样更倾向于面向对面的思想了，这正是4.2的新特性之一，下面来个例子：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
|
<%@ page language=
"java"
contentType=
"text/html; charset=UTF-8"
pageEncoding=
"UTF-8"
%>
<!DOCTYPE html PUBLIC
"-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"
>
<html>
<head>
<meta http-equiv=
"Content-Type"
content=
"text/html; charset=UTF-8"
>
<title>Hello Extjs4.2</title>
<link href=
"../ExtJS4.2/resources/css/ext-all.css"
rel=
"stylesheet"
>
<!-- <script src=
"../ExtJS4.2/locale/ext-lang-zh_CN.js"
></script> -->
<script src=
"../ExtJS4.2/ext-all.js"
></script>
<script type=
"text/javascript"
>
/* Start ExtJS 中自定义类 **/
Ext.define(
"Person"
, {
Name:
''
,
Age: 0,
Say:
function
(msg) {
Ext.Msg.alert(
this
.Name +
" Says:"
, msg);
},
constructor:
function
(name, age) {
this
.Name = name;
this
.Age = age;
}
});
Ext.onReady(
function
(){
var
Tom =
new
Person(
"束洋洋"
, 22);
Tom.Say(
"你好，ExtJs4.2"
);
});
/* END ExtJS 中自定义类 **/
</script>
</head>
<body>
<h1>我的ExtJS4.2学习之路</h1>
<hr />
作者：束洋洋
开始日期：2013年10月29日 00:51:00
<h2>第二个例子：ExtJS 中自定义类</h2>
</body>
</html>
|
弹出效果：
本文转自shyy8712872 51CTO博客，原文链接：http://blog.51cto.com/shuyangyang/1328232，如需转载请自行联系原作者
