关于EXT什么时候引入JS

我看了几个EXT的小项目，他们都是在login成功后，重定向到 index 页面然后在这个 index 里面一次性把所有的 js 都加载进来这样不会不不好？如果项目稍微大一点，可能有两三百个js 那样刚登陆的时候不是会很慢？我知道还有一种方案是, 把js在不同的html中引入，而在index页面，只要用 panel 的 load（）方法，去加载这个html。不知道这样算不算延迟加载了大家一般是怎么处理js的加载的呢？

运行老是跑failure方法里去，肯定是你url那里出问题，url要分清是相对url和绝对url，因为ext就只有一个主界面页面，所以的相对url都会被解析到这个地址的相对地址。

可以动态的进行加载，不过要把握好时机，哈哈。

我一般是做一个引入页面a, a 上面引入了js

然后在index.html加载完后，再引入 a页面

panel 的 load（） 方法，去加载这个html   这样的引用实际上是把ext分离了，做了太多这样的引入页面，会带来负面作用，典型的就是portal时候，这load会导致ext出现很多的bug（用的越深，bug越多）。
一部分适合load的可以采用，把多个js文件进行namesapce的组合，然后做多层级加载，首页调用都是用自己的namespace封装好的类来调用，虽然不能完全解决这个问题，希望能有帮助。
ps：用ext如果代码写成到处跳转，那就有点失败了

传说，EXTjs 很耗内存。。。 :oops:

我以前是用一个Ajax请求道服务器，然后根据需要返回js，然后eval这个js。这样可以做到按需加载JS

偶买噶，俩三百个js一个页面。。

Ext那么大一个库压缩完要500多K，一般的系统压缩完js大小不会超过10kb，执行一般也不会超过一秒，你所谓的那种延迟加载没有只会加大系统维护难度，降低组件可用性，而且更容易造成内存泄漏。Ext这种重量级、高耦合度不适合使用延迟加载，而是使用OOP的方式进行构建，如果对项目载入速度有需求的话请去学习YUI的延迟加载

不是一般都是引用基础的js嘛！然后再根据需要在引用你所需要

依赖计算
动态加载

给每个JS文件定义它的[b]直接依赖[/b]
最终会形成一个依赖树

依赖数据会加载到本地，浏览器在加载某个文件时递归查询依赖表（也就是树的后序遍历，保证加载顺序）。最后得到一个需要加载的JS文件的列表。

然后将文件列表用Ajax发给服务器；或者自己一个个请求，最后合并执行。
（执行部分可以参考jQuery的globalEval方法）

以上有些细节部分未考虑，比如判断是否已经加载过，看实际情况处理吧

应该以组件对象的方式来看待Extjs。

Ext每次Ajax请求应该返回两类结果，一类是Json或XML这类数据结果，另外一类就是带有Ext组件的匿名JS函数，此JS函数的返回值是一个组装完全的Ext组件，此Ext组件不一定包含数据，当此组件render的时候再去加载真正的数据（也就是Json或XML结果）。当此组件用完后，关闭会被Ext的Component管理器destroy，内存会回收。

所以真正需要加载的js，仅仅是ext-all和插件以及初始化配置的js(例如本地化语言库)，这些加载一次就被浏览器本地缓存了。

例子，引用自大漠穷秋的Ext API 中文文档：

如果需要向一个在服务器端自动生成的TabPanel中添加组件时，必须创建一个服务器端脚本来生成Javascript，以便创建所需的组件。

例如，向TabPanel中添加一个GridPanel，而GridPanel是服务器端根据特定的参数生成的，你需要执行一个Ajax请求去调用你的脚本，然后处理response对象，以便将它添加到TabPanel中:

[code="js"]Ext.Ajax.request({
url: 'gen-invoice-grid.php',
params: {
startDate = Ext.getCmp('start-date').getValue(),
endDate = Ext.getCmp('end-date').getValue()
},
success: function(xhr) {
var newComponent = eval(xhr.responseText);
myTabPanel.add(newComponent);
myTabPanel.setActiveTab(newComponent);
},
failure: function() {
Ext.Msg.alert("Grid create failed", "Server communication
failure");
}
});[/code]
服务器端脚本应该返回一个可执行的Javascript声明，它将会被用eval() 处理，然后要么返回一个配置对象，其中包含一个 xtype, 属性；或者返回一个初始化好的组件。例如:

code="js" {
function formatDate(value){
return value ? value.dateFormat('M d, Y') : '';
};

var store = new Ext.data.Store({
    url: 'get-invoice-data.php',
    baseParams: {
        startDate: '01/01/2008',
        endDate: '01/31/2008'
    }
    reader: new Ext.data.JsonReader({
        record: 'transaction',
        id: 'id',
        totalRecords: 'total'
    }, [
       'customer',
       'invNo',
       {name: 'date', type: 'date', dateFormat: 'm/d/Y'},
       {name: 'value', type: 'float'}
    ])
});

var grid = new Ext.grid.GridPanel({
    title: 'Invoice Report',
    bbar: new Ext.PagingToolbar(store),
    store: store,
    columns: [
        {header: "Customer", width: 250, dataIndex: 'customer', sortable: true},
        {header: "Invoice Number", width: 120, dataIndex: 'invNo', sortable: true},
        {header: "Invoice Date", width: 100, dataIndex: 'date', renderer: formatDate, sortable: true},
        {header: "Value", width: 120, dataIndex: 'value', renderer: 'usMoney', sortable: true}
    ],
});
store.load();
return grid;

})();[/code]
因为这段脚本是服务器端脚本生成的，所以 Store的baseParams可以被配置给Store、允许用metadata生成Record的布局，并且ColumnModel对服务器端是可见的，故可以直接生成到脚本中。

当这段脚本片段被传递到Ajax请求的success监听器中的 eval函数时，代码会被Javascript处理器执行，然后这个匿名的函数运行，并返回grid。

[quote]
比如我后台是java语言，那我拼凑出一段 javascript 字符串，相当麻烦啊。 [/quote]

用java拼装Js当然麻烦，你写的是web程序，纯servlet的话可以用request.getRequestDispacher("/xxx/xxxx.jsp").forward(request,response);然后在jsp里面写js，就没那么痛苦。关键是ext有很多例子，copy过来改改就能用。用ext有个好处就是，你的js不必结合java来写，是纯js，因为ext的数据和前台框架剥离得很好了。java只要集中处理json。jsp里写js比在js文件里的劣势是没有IDE的辅助功能。你可以先在js里写好，再拷贝过来也行。过程灵活多了。不累述了。

java对象转json就简单多了。用json-lib可以做到，只要你符合javabean的规范，唯一麻烦的是日期对象。参考此贴：[url]http://www.iteye.com/topic/165717[/url]

[quote]还有，比如有2个表，一个是公司，一个是部门，部门表里一外键引用公司ID，
公司查询的时候，有个 company_store, 部门查询的时候也有一个 company_store
照您那么说的，其实每个功能模块的独立了，像这个 company_store 如果在
不同的表中引用，每次都要生成 company_store 这个对象的代码，基本上谈不上重用性呀[/quote]

你这里说的store和ext的store是两回事吧你说的store是json对象吧？json对象仅仅是字符串而已。结果jsp通常只有这么一行代码[code="java"]${json}[/code]

ext的store只是作为数据的客户端存储。实际上还要通过DataProxy和服务器通信。客户端的数据就太多样了，有时候是一个表的一部分，有时候是2个表结合显示的。麻烦的地方可能是你怎么把这些对象转换成适合ext显示的json对象。这个就要适当处理了。

通俗点说吧。比如：
你有个Hibernate Pojo：
class student{
String name;
int age;
String sex;
Teacher teacher;
}

而你ext grid上面要显示teacher的名字。

可能需要有一个值对象或者中间对象来做转换。才能得到符合要求的json对象。

好人做到底吧。
我通常这么做。
class studentVo{
String name;
int age;
String sex;

}

好人做到底吧。
我通常这么做。
class studentVo{
String name;
int age;
String sex;
String teacherName;

public void loadModel(student st){
BeanUtils.copyProperties(st,this);
this.teacherName = st.getTeacher().getName();
}
}

此处setter和getter省略了。

总体来说也不是特别麻烦。

上面那贴按错按钮，不小心回复了。。。 :x

BeanUtils.copyProperties(this,st);
手写代码搞错了。 :oops: