layui实现跳转到指定tab栏

需求:实现页面之间的联动跳转,并跳转到指定tab栏
解决方法:
步骤1:
在正常选项卡基础上,增加如图代码。
lay-filter代表地址栏中参数的名称。
lay-id来作为唯一的匹配索引,以用于外部的定位切换。

layui实现跳转到指定tab栏_第1张图片

步骤2:
初始化layui tab

layui.use('element', function(){
    var element = layui.element;
    //获取hash来切换选项卡,假设当前地址的hash为lay-id对应的值
    var layid = location.hash.replace(/^#current=/, '');//current为刚才定义的lay-filter
    element.tabChange('current', layid); //假设当前地址为:http://a.com#current=two,那么选项卡会自动切换到“资产发现”这一项
    //监听Tab切换,以改变地址hash值
    element.on('tab(current)', function(){
        location.hash = 'current='+ this.getAttribute('lay-id');
    });
});

你可能感兴趣的:(layer)