<!-- 背景: 在做页面的过程中需要在页面列表里面添加数据,但是添加之后需要手动刷新页面才会出现添加的数据-->
方法1,通过对window方法绑定,实现回调刷新
代码如下:
mounted(){
// 把vue组件的methods方法绑定到window
window['search'] = ()=> {this.search()};
}
方法2,通过添加页面监听实现
// 添加页面监听器,监听宿舍选择页面发送的信息
window.addEventListener(‘message’,this.listenHouseSearch);
},
/**
*监听宿舍选择的窗口返回的数据
*/
listenHouseSearch(e){
const { data } = e;
//检测当前数据是由宿舍选择页面传来的
if(data && data.action === messageAction){
const { result } = data;
//给当前行的房间下拉菜单赋房间信息供用户选择
this.setCurrRowRoom(result,this.currTableIndex);
}
},
子页面向父页面发送消息
window.opener.postMessage({
action: messageAction,
result: this.currRoomList,
})
// 接收到数据后,清除监听器
window.removeEventList