最近遇到一个项目需求：Angular中父窗口新开的子窗口提交完信息关闭的时候刷新父窗口。
知识点：
window.opener
概述
返回打开当前窗口的那个窗口的引用，例如：在window A中打开了window B，B.opener 返回 A.
语法
var objRef = window.opener;
例子
if (window.opener != indexWin) {referToTop(window.opener);}
备注
如果当前窗口是由另一个窗口打开的, window.opener保留了那个窗口的引用. 如果当前窗口不是由其他窗口打开的, 则该属性返回 null.
Can I use
新创建的window对象有一个opener属性，其中保存着打开它的原始窗口对象。这个属性只在弹出窗口中的最外层window对象（top）中有定义，而且指向调用window.open()的窗口或框架。表示新window需要跟另一个标签通信。opener设置为null,表示新打开的标签页可以运行在独立的进程中。
自己写的测试demo能实现
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title><script src="js/vue.js" type="text/javascript" charset="utf-8"></script></head><body><div id="app">{{ message }}<button type="button" @click="closeThisWindow">close</button><button type="button" @click="openSonWindow">open</button></div><script type="text/javascript">var app = new Vue({el: '#app',data: {message: 'Hello Vue!'},mounted() {// 将backToday方法绑定到window下面，提供给外部调用window['backToday'] = () => {this.goToday()}// 注册监听window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))},destroyed() {// 非窗口关闭的跳转直接卸掉监听window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))},methods: {// 父窗口关闭方法beforeunloadHandler(e) {// 关闭父窗口window.opener && window.opener.location.reload()// 也可以只调用父窗口方法刷新数据（需要在父窗口中手动为window创建一个调用方法的方法）// window.opener && window.opener.backToday()},closeThisWindow() {// 第二种方式直接就是好window.opener.location.reload();window.close();},openSonWindow() {this.message = 'new parent'window.open('/test/src/index2.html')},goToday() {this.message = 'new parent refreash'}}})</script></body>
</html>
简单直接点
window.opener.location.reload();
window.close();
