幽灵资源网 Design By www.bzswh.com
1、路由携带数据跳转
routerAction(hideDisplays, data) {
switch (hideDisplays) {
case "pubAccountMenu":
this.$router.push({
name: "AppAccountInfo",
});
break;
//在菜单路由上存储各种需要信息
case "publicDocInfoMenu": //菜单code: publicDocInfoMenu
data.instanceInfo.active = 4 //标记已点击的标签页
data.instanceInfo.fromMenu = true
data.instanceInfo.editOrAdd = false;
this.getUcMenuInfo(data.instanceInfo) //数据、对象等
this.$router.push({
name: "DocumentInfoMaint",
params: {
instanceInfo: data.instanceInfo,
uuid: data.uuid,
breadCrumb: data.instanceInfo.name,
breadCrumbEn: En_Name,
prefix: 'text.breadCrumb.MyUseCase', //面包屑信息
prefixPath: '/MyApplications',
breadPath: '/AppInfo/' + data.uuid,
routeName:'AppInfo',
prefixRouteName:'MyApplications',
firstRoute:true
}
});
break;
}
}
2、路由监听
watch: {
$route: function (to, from) {
if (this.$route.params.instanceInfo) {
// let data = JSON.parse(this.$route.params.instanceInfo);
let isObject = this.$route.params.instanceInfo; //获取路由传过来的数据
//判断数据是否为对象,如果不是,则解析并获取数据
let data = isObject instanceof Object "SolutionInfo")) {//在浏览器的本地存储中获取数据
//一般数据在浏览器的本地存储中会以JOSN字符串的方式存储,所以要把数据转换成JSON对象来使用
let data = JSON.parse(localStorage.getItem("SolutionInfo"));
this.currentProductId = data.uuid;
this.solutionUuid = data.uuid;
this.setValue(data)
}
}
}
3、值监听
页面A:
//定义要监听的对象
<vm-register-table :param="param" :child-open-table="jumpOrDialog" />
例如监听param:
(1).若param为对象,则需要把它转换成JSON字符串
let tenantParam = {
tenantId:tenantId,
isTerminals: this.jumpOrDialog.isTerminals
}
this.param = JSON.stringify(tenantParam);
(2).若param为字符串,则不用做任何转换
this.param = currentPage;
页面B:
//1.注册监听对象
props: ['childOpenTable','param'],
//2.监听
(1).
watch:{
param:function(oldValue){
console.log("newValue++"+oldValue)
let jumpOrDialog = JSON.parse(oldValue)
console.log("jumpOrDialog==++"+jumpOrDialog)
let isTerminal = jumpOrDialog.isTerminals
if(isTerminal){
this.tenantId = jumpOrDialog.tenantId;
}else{
let userInfo = JSON.parse(localStorage.getItem("userInfo"))
this.tenantId = userInfo.tenantId;
}
let vmData = {
tenantId: this.tenantId,
pageNum: this.pageNum,
pageSize: this.pageSize
}
this.getAllVmRegister(vmData);
}
},
(2).
watch:{
param:function(oldValue){
let pages = JSON.parse(oldValue)
this.currentPage = pages;
}
}
以上这篇vue实现路由监听和参数监听就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
标签:
vue,路由监听,参数监听
幽灵资源网 Design By www.bzswh.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
幽灵资源网 Design By www.bzswh.com
暂无评论...