layer ui使用多层弹框时，各个页面交互问题

Posted 2020-11-02

最近在用layer ui的弹框做项目，使用的时候有时会用到2-3级的弹框，多级弹框会遇到每个弹框的数据之间的交互问题，例如：

图中有两个弹框父级弹框编辑用户，子级弹框角色分配，我所选中的复选框，需要在父级弹框里显示出来
那我父级页面的弹框的代码可以这样写
$(‘.user-add‘).on("click", function() {
var url = basePath + "/admin/user/v/userAdd";
layer.open({
type: 2,
title: [‘添加用户‘, ‘font-size:16px;‘],
fixed: false, //不固定
area: ["735px", "545px"], //宽高
shade: 0.4,
content: url,
id: "addresourcedialog",
});
});

打开子级页面的代码

子级页面数据交互的代码
var thisFrame =parent.window.document.getElementById("addresourcedialog").getElementsByTagName("iframe")[0].id;
var dcmt = parent.$(‘#‘+thisFrame)[0].contentWindow;

这里的dcmt就是父级页面了，在子级页面我们可以操作父级页面的数据了