layui admin iframe版子页面如何新增tab选项卡

其实这个问题只要不是伸手党都会解决，查看layui admin.js的源码就知道人家是怎么处理的了，不过总有很多小白不懂，所以还是总结一下吧！

特别注意：admin ifram版中，不能直接调用tabAdd方法新增tab，你会发现tab增加了，但是内容主体没有新增。

layui中的a标签新增tab是通过lay-herf点击事件完成的，那么查看源码中的lay-herf点击事件，得到如下代码：

o.on("click","*[lay-href]", function(){
            var e=a(this),i=e.attr("lay-href"),t=e.attr("lay-text");
            layui.router();
            F.tabsPage.elem=e;var l=parent===self?layui:top.layui;l.index.openTabsPage(i,t||e.text())
        }),

我们最终需要用到的是这段代码：

// i:iframe请求地址
// t:tab标签名称
var l=parent===self?layui:top.layui;l.index.openTabsPage(i,t||e.text());

实例：

<table class="layui-hide" id="test-table-operate" lay-filter="test-table-operate"></table>

<script type="text/html" id="test-table-operate-barDemo">
       <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
</script>

<script>
layui.config({
            base: '/staticResource/layuiadmin/' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index' , 'table'] , function () {
            var table = layui.table
                ,admin = layui.admin
                ,element = layui.element;


//监听工具条:table中点击查看，打开该记录的form表单

            let openFormActive = {
                tabAdd:function () {
                    layui.router();
                    let i = "/a/user/form" , t = "用户表单";
                    let l=parent===self?layui:top.layui;l.index.openTabsPage(i,t);
                }
            };


            table.on('tool(test-table-operate)', function(obj){
                var data = obj.data;
                if(obj.event === 'detail'){
                    openFormActive['tabAdd'].call(this);
                    // layer.msg('ID：'+ data.id + ' 的查看操作');
                } else if(obj.event === 'del'){
                    layer.confirm('真的删除行么', function(index){
                        obj.del();
                        layer.close(index);
                    });
                } else if(obj.event === 'edit'){
                    layer.alert('编辑行：<br>'+ JSON.stringify(data))
                }
            });
});
</script>