现在的位置: 首页 > easyui > Layout > panel > 正文
正确对待panel和tabs组件的cache属性
2012年05月24日 panel, tabs ⁄ 共 1545字 评论数 1 ⁄ 被围观 18,590 views+
文章目录
[隐藏]

Easyui的面板组件(panel)有个cache属性,这个属性究竟有什么用处,体现在哪里?本文就针对几点需要注意的地方做特别说明,文字上不做冗余的描述了。

panel缓存的体现:

当我们展开收起状态的panel的时候,cache会起作用。

在设置了href属性的前提下:当我们展开一个收起状态的面板时,如果cache设置为false,面板将重新向目标URL发送数据请求,获取到新数据加载到面板中显示;如果cache设置为true,这个展开的过程将不会发送ajax请求目标URL数据。

当我们打开关闭状态的面板的时候,cache会起作用。

在设置了href属性的前提下:如果我们打开一个关闭状态的panel,cache设置为false的话,panel就会向目标重新发送ajax数据请求获取数据,刷新到面板中;设置为true就不会重新发送ajax请求。

当我们使用panel构造函数的时候,cache会起作用。

在设置了href属性的前提下:如果我们在代码中多次对同一个面板进行初始化,即多次调用

$(selector).panel({title:'New title',..});

如果cache设置为true的话,多次构造panel组件并不会发送多次ajax请求,只有第一次的时候发送;如果cache设置为false,则每次构造都会重新发送ajax请求。

tabs组件缓存的体现:

tabs组件依赖panel组件,也继承了cache属性,那么对于tabs组件,tabs的关闭等于panel的销毁,所以说增加一个选项卡是不存在是否缓存的问题了,都会发送ajax请求,同时tabs组件也没有收起和展开的行为,所以也牵扯不到缓存,那么,cache属性到底体现在哪里呢?。

每次选择或者点击选项卡的时候,cache都会起作用。

在设置了href属性的前提下:如果cache设置成false,简直就会造成灾难,每次选中或点击选项卡都会重新请求数据,设置成true的话,当然就不会重新请求数据了,所以对于tabs组件的cache属性,没什么特殊要求,强烈建议设置为true。

cache会起作用还体现在tabs组件的update方法上

在设置了href属性的前提下:如果cache设置为true,使用update更新选项卡标题,图标以及内容的时候,你就会发现选项卡的标题,图标什么的可以正常更新,但是内容就是不更新,分析源码的话,tabs组件的update方法只是调用了panel的构造函数再次初始化面板,而cache为true的时候,多次初始化面板根本不会再次发送ajax请求。

是不是很囧了?cache设置为true的话,想刷新选项卡的内容咋办,tabs组件的update函数不怎么好使。而cache设置为false的话,每次点击选项卡都会刷新,刷新频率又太变态。幸运的是,我们还可以通过tabs组件的getTab方法获取到panel对象,进而利用panel对象的refresh方法刷新选项卡的内容。

var panel = $('tabsId').tabs('getTab','选项卡标题');
//var panel = $('tabsId').tabs('getSelected');这样也可以
panel.panel('refresh','新的url地址');
当我们使用tabs构造函数的时候,cache会起作用。

这个原理和现场跟panel组件都是一样的,当某一个tab的cache为true的时候,重新调用构造函数不会发生二次请求,而cache为false的话就会出现二次请求。

目前有 1 条留言 其中:访客:0 条, 博主:0 条 引用: 1

    给我留言

    留言无头像?


    ×