JS -- 如何借助 url 由一个页面像另一个页面传递参数(两种方式)& 新增、移除面包屑 -- 7

tech2022-08-27  124

方式一

当前 js

传递一个参数

跳转方法{ var url ="/acl_**_topo/pages/rootcause/rootcauseMgmt.jsp?topoId=" + topoMapId; top.navigatorTop.jumpTo({name:'根源告警配置',url:url}); }); }

传递多个参数

var url ="/acl_view_application_topo/pages/rootcause/rootcauseMgmt.jsp?topoId=" + topoMapId+"&pageType="+"rel"; top.navigatorTop.jumpTo({name:'根源告警配置',url:url});

rootcauseMgmt.jsp

<% String topoId = request.getParameter("topoId"); %> <script type="text/javascript"> var topoId= "<%=topoId%>"; </script>

在相关 js 中可以直接使用 topoId,但是不能在 beforeMount 中使用(此时 topoId 值为 null),但可以在 mounted 方法中使用

方式二(Vue)

当前 js

从列表页跳转到新增页,新增面包屑

handleAppTemplateDetail(index,row){ var _self = this; _self.$router.push({name:"addAppTemplate",query:{appTemplateId:row.id,isAdd:false}}); top.navigatorTop.addBreadcrumbNode(_self.$t('breadcrumb.appTemplate'),null,null,null,true,function(){ _self.$router.push({path: "/addAppTemplate",query:{templateId:row.id,isAdd:false}}); }); },

Management.js

var routes = [ {name:'appTemplateList',path: '/appTemplateList', component: appTemplateListConst}, {name:'addAppTemplate',path: '/addAppTemplate',component:addAppTemplateConst} ]; function initMethod(){ resizeContainer(); var router = new vueRouter({ routes:routes }); globalVue = new Vue({ router:router, i18n }).$mount('#content'); router.push({path: "/appTemplateList"}); }

addAppTemplate.js 接收参数

this.beforeMount = function(){ var _self = this; var _params = this.$route.query; _self.isAdd = _params.isAdd; _self.appTemplateId = _params.appTemplateId; },

有的地方用 this.$route.params 接受参数,但这种方式有些时候会报错。因此更多使用 this.$route.query

删除面包屑,回到列表页。这步操作一般都是点击新增页的保存按钮或者取消按钮触发的

this.$router.push({path: "/appTemplateList"}); top.navigatorTop.removeLastBreadNode(false);
最新回复(0)