JavaScript对象expando属性强大、优美的地方

最新推荐文章于 2025-08-15 09:22:46 发布

最新推荐文章于 2025-08-15 09:22:46 发布 · 270 阅读

文章标签：

#JavaScript #EXT #HTML #ViewUI

本文介绍了一个使用Ext.Window实现的会员登录对话框案例。通过XHR验证用户身份后返回用户名，并将其显示在对话框标题中。文章详细展示了如何通过构造器设置用户属性并更新标题。

下面是一个会员登录对话框，要求XHR验证用户身份后返回用户名称，显示在对话框标题上
[code]
//JumperDailog为对话框类，注意title属性是待格式化文本，{0}代表将来的“用户名称”的位置
JumperDailog = Ext.extend(Ext.Window, {
width : 625,
height : 332,
title : '{0}已成功登录',
style : "text-align:center",
initComponent : function(){
alert(this.title+this.UserName);
this.setTitle(String.format(this.title, this.UserName));//this.UserName从配置项对象上得到
},
html : {tag : 'div', children :[
............
]}
});[/code]

登录成功后：[code]
(new JumperDlg({
UserName : 'Jack' //这里应是XHR返回的用户名
})).show()[/code]
UserName的属性经过JumperDailog的构造器内apply函数实现复制，挂到JumperDailog身上（expando的体现），
然后initComponent ＋ setTitle的方法实现了 “Jack已成功登录”之文本，
－－[b]一切貌合神离，一切无须多讲[/b]！