Layui 列表页面关闭子窗口刷新列表数据

问题：

业务反馈一个问题：比如在某一个数据列表的第10页，点击修改按钮，对数据进行修改，点击提交后，页面直接整个刷新，列表也直接跳回了第1页。问：能不能保持列表的搜索条件，不全局刷新？

排查

经查看，是在子窗口提交接口的处理逻辑里面发现了如下代码：

success: function (data) {
      if (data.code === 'success') {
           var index = parent.layer.getFrameIndex(window.name);//获取子窗口索引
           parent.layer.close(index);//关闭当前页
           parent.location.reload();//父窗口刷新
       } else {
           layer.msg("确认失败：" + data.msg);
       }
   }

那么父页面整个刷新的逻辑就找到了。

问题解决

经查，发现了实现业务的需求有两种方式：

方法一：

将逻辑写在子页面这里，将上述代码修改为

success: function (data) {
      if (data.code === 'success') {
           var index = parent.layer.getFrameIndex(window.name);//获取子窗口索引
           parent.layer.close(index);//关闭当前页
           此处的这个parentId为父页面数据列表处的那个table的id，且注意父页面一定要定义了table
           parent.layui.table.reload("parentId");
       } else {
           layer.msg("确认失败：" + data.msg);
       }
   }

将父页面整体刷新的代码替换为：

即可解决问题。

方法二：

由于子页面的打开方式是通过layer.open的方式打开的，如下所示：

layer.open({
       type: 2,
       title: "修改数据",
       area: ['700px', '500px'],
       content: "url"
   });

经查看，Layui文档，发现这里面还有一个end参数，即关闭了弹窗就会执行的逻辑：
所以在layer.open里面写好end方法，如下：

layer.open({
       type: 2,
       title: "修改数据",
       area: ['700px', '500px'],
       content: "url",
       end: function (){
          layui.table.reload("tableId")
      }
   });

同样可以解决问题。

插曲

在一个列表使用上述任一方式获得成功后，又在另一个页面尝试使用了上述的方法一，但是页面却报错了：
Uncaught TypeError: Cannot read properties of undefined (reading ‘reload’)
提示相关的table没有定义，但是对比了两个子页面的JS代码，几乎没有差异，几经对比发现，此处报错的这个父页面的代码，使用的是

parent.layer.open

而它本身就是父页面了，类似于最底层了，不用再使用parent，于是将此处的代码直接修改成

layer.open

修改完成后，再进行测试，发现问题解决。

最后

经过对比，由于上述方式二需要，在子页面填写父页面相关数据列表的id，为了避免出错，还是推荐在父页面，使用layer.open的时候直接写好end方法。