dwz框架实现关闭navTab刷新指定navTab的一种方案

版本:1.46

在开发公司的应用中,遇到需求:关闭navTab刷新指定navTab(如图,例如关闭页面三,则刷新页面一的操作)



用过dwz的人应该知道,刷新的操作navTab.reloadFlag(指定的rel),如果是新手的话,建议去dwz看一下源码或文档。

那么关闭当前navTab有如下几种方式



1、是点击提交或取消按钮关闭

2、面板右上角的X关闭

我们可以来分析一下:

第一种方式关闭按钮之后刷新navTab可以在按钮中新增onclick事件调用dwz原生的关闭方法之前加navTab.reloadFlag(),但是第二种方式确无从下手,所以就想到了改源码。

我们可以来看一下dwz.navTab.js这个js文件关闭当前navTab调用了哪些方法,

_closeTab: function(index, openTabid){
this._getTabs().eq(index).remove();
this._getPanels().eq(index).remove();
this._getMoreLi().eq(index).remove();
if (this._currentIndex >= index) this._currentIndex--;

if (openTabid) {
var openIndex = this._indexTabId(openTabid);
if (openIndex > 0) this._currentIndex = openIndex;
}

this._init();
this._scrollCurrent();
this._reload(this._getTabs().eq(this._currentIndex));
},


我们可以先看看_init()的代码

_init: function(){
var $this = this;
this._getTabs().each(function(iTabIndex){
$(this).unbind("click").click(function(event){
$this._switchTab(iTabIndex);
});
$(this).find(navTab._op.close$).unbind("click").click(function(){
$this._closeTab(iTabIndex);
});

});
this._getMoreLi().each(function(iTabIndex){
$(this).find(">a").unbind("click").click(function(event){
$this._switchTab(iTabIndex);
});
});
this._switchTab(this._currentIndex);
},


源码的信息量有点多,不一一细讲,但是可以看得出来关闭navTab的时候,最终调用的方法是划红线部分的代码,所以需要在之前刷新指定页面就可以实现,这样就需要给面板加一个自定义属性,所以需要在打开navTab的时候就生成好,页面渲染的时候,都是跟dwz.ui.js的代码相关,需要看一下里面哪里调用navTab.openTab()这个方法,我把自定义属性命名为refreshRel,有虚线阴影部分都是我自己加的


划红线部分为新加代码



这样面板生成之后就会多了refreshRel这个属性,最后,修改的代码如下


在准备打开面板的页面上新增如下配置信息(注意:tab_workFormList是我项目中的rel,大家要修改成指定rel)



这样,无论是第一种方式或是第二种方式关闭当前navTab,都是起到刷新指定navTab的效果


该方案只是我想到的其中一种方式,大家觉得哪里有问题,欢迎指正。如果大家有什么更好的方法实现,欢迎留言交流。


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值