今天是学习EXTJS4.0的第二课,主要学习了6点知识,内容有点多,但是非常简单。在这里,简单的梳理一下今天的学习的6个知识点:
1、 JS类的声明和对象的创建
2、用EXTJS new 创建一个window
3、用create创建一个window,并用一个按钮进行触发显示
4、用queries异步加载JS,提高运行速度
5、用Ext.class中的config来为属性自动设置set()和get()方法
6、用Ext.class中的mixins来混合类,实现多继承
以上6点是我今天的学习内容,不多说,实践一下就知道有多简单!!!。。。。。。。。。。。
在昨天的项目中做如下添加:
添加完了 不要忘记在index.jsp中添加 lesson2.html的<a>标签哦!
在lesson2.html网页中添加如下代码。(今天调整了一下css的路径,路径按照你需要的设置即可),如下图:
这里主要是添加了一个button标签,用于触发的作用。
在createClass.js中添加如下JS代码:
在index界面中,点击 第二课 超链接 ,运行结果是:会弹出3个对话框,内容分别是:“caixen”,“[email protected]”,“caixen---23”
好了,第一个成功! 下面进入第二个知识点。注释掉以上的代码,在下面键入以下代码:
运行一下,是不是点击 按钮 就会弹出对话框呢? O(∩_∩)O~
成功后,我们进入第三个知识点。用craete创建window窗体,不用new关键字了。。。。。
注释掉上面的代码,在下面键入:
这里运行一下,就会看到一个对话框弹出。
好了,我们进入4的一个知识点:用requires异步加载JS(要使用的时候才加载相应的JS,提高运行速度)
在这里,当我们点击按钮时,它才加载我们的 mywin.js这个js文件,没有点击时是没有加载的哦~~~
注释掉上面的代码,在下面键入如下代码:
这时,我们切换到mywin.js文件下,键入如下code:
运行一下,用浏览器跟踪一下,看是不是在点击 按钮之后,才加载的mywin.js ~~~
好了,我们终于到了5的一个知识点了:运用Ext.class中的config来为属性自动设置get()与set()方法
这个很简单,其实就是在mywin.js中加入一个config的属性,就直接可以调用了。非常方便,不用自己写方法调用。如下:
蓝色标出的就是添加的!!!!
这时我们在createClass.js下,注释掉刚刚的代码,在下面键入code如下:
是不是能弹出price啊~~~ 很简单吧。
哎。。终于到了最后一点了,使用Ext.class中的mixins来多继承。直接上图就OK!
注释掉mywin.js下载代码,重新键入code如下:
运行一下,OK 。同时弹出了混合的方法, 吼吼吼~~~~大功告成,今天内容有点多,多多复习啊。