不同页面之间通讯交互数据；明细页保存后刷新A页面数据
场景
在B页面刷新A页面数据，数据编辑页面保存数据后，要刷新数据列表页面的数据，因为是两个不同页面，因此不能直接交互
方案
YESWEB开发框架 提供了 $eventHub 属性，专门用于页面之前通讯
实现
比如我们现在有两个页面：客户列表页 和 客户编辑页
我们想要在客户编辑页保存的时候，自动刷新客户列表页的数据
1) 客户列表页注册事件 customer.update
我们需要在客户列表页的create方法中注册一个事件，事件名字要唯一
演示代码我们定义的事件名字为：customer.update
JavaScript 全选
created() {
this.$eventHub.$on("customer.update", this.refrshData);
},
beforeDestroy() {
this.$eventHub.$off("customer.update", this.refrshData);
},2) 客户编辑页调用事件 customer.update
在客户编辑页保存后，调用 customer.update 事件 this.$eventHub.$emit('customer.update')
JavaScript 全选
// 提交
onEventSubmit(btn) {
this.$refs["form"].validate((valid) => {
if (valid) {
var req;
if (utils.isNULL(this.data[this.keyField])) {
req = request.create(this, this.data);
} else {
req = request.update(this, this.data);
}
req.then((res) => {
this.drawer = false;
this.$message({
message: "保存成功",
type: "success",
});
this.$eventHub.$emit('customer.update')
this.$parent.closeCurrent(this.afterCloseGoUrl);
});
} else {
this.$message({
message: "请完善数据",
type: "warning",
});
return false;
}
});
版权声明：本文为YES开发框架网发布内容,转载请附上原文出处连接
yesweb 张国生
