一.快照中点“搜索”,弹出新标签页,且原始页面过滤条件不变
原来的逻辑是子类evePhotoModal.vue直接把filter $emit给父类event.vue,父类中直接setRules(filter)做DOM操作
思路:
-
evePhotoModal.vue中:
(1) handleSelectEve()函数 this.modal应该是类似于dialog.visable 控制对话框的显示/隐藏
,这里改为“true”,需求是点完搜索也不关闭(2) 利用 window.open(’/’, ‘_blank’) 打开新的event页 ,在event.mounted生命周期函数中用window.opener接收过滤器, 这里参数传递卡了很长时间最后找了一个我认为没用的window全局变量:window.onsubmit = { rules: rules }
(3) mounted()生命周期函数中 ,window.opener.onsubmit取到过滤器,直接setRules
代码:
子类 evePhotoModal.vue :
this.modal = true //点击搜索不关闭快照页,原代码这里是false __xu
//弹出新的浏览器标签页,并用window.onsubmit储存过滤器参数并传递到open出来的event页__xu
window.onsubmit = { rules: rules }
window.open('/', '_blank')
父类 event.vue:
var filter
if (window.opener) { //如果此event页面是被window.open出来的,则用filter接收父页面传来的过滤器参数(evePhotoModal通过window.open传参过来)__xu
filter = window.opener.onsubmit
}
if (this.$route.params.id) {
this.getSavedList(this.$route.params.id)
} else if (filter) {
this.$refs['queryBuilder'].setRules(filter) //这行是后插入进来的,(如果有父级传来的过滤器就渲染否则用默认过滤器__xu
} else {
this.$refs['queryBuilder'].setRules(this.rulesData)
}
开始我在evePhotoModal里自己var了个全局但是不好使。。。这里的onsubmit全局 我是随便找的,我看他一直为null 觉得他没用,最后这样传过来了
可以在event.vue中console.log(window.opner)