依据router上的存储对象名分2类

1. params
2. queryParams

依据href的展示和应用办法分3类

1. 500/jack (params)
2. /500;name=jack (params)
3. /500?name=jack (queryParams)

以下依照3类的传值办法提供代码样例

Angular

1 500/jack

// routes的配置{ path: '500/:name', component: Exception500Component }"500/jack" //地址体现//导航的两种写法<button [routerLink]="['/500','jack']">测试1</button>  navigateTo(){    this.router.navigate(['/500','jack'])  }   //接管参数的两种写法 依据须要来抉择activatedRoute.snapshot.params // {name:'jack'}activatedRoute.params.subscribe(data=>{        //data {name:'jack'} })

2 /500;name=jack

 //地址体现"/500;name=jack"//导航的两种写法<button [routerLink]="['/500',{name:'jack'}]">测试1</button>navigateTo(){    this.router.navigate(['/500',{name:'jack'}])  }// 接管参数的两种写法 依据须要来抉择activatedRoute.snapshot.params // {name:'jack'}activatedRoute.params.subscribe(data=>{        //data {name:'jack'} })

3 /500?name=jack

"/500?name=jack" //地址体现<button [routerLink]="['/500']" [queryParams]="{name: 'jack'}">测试1</button>navigateTo(){       this.router.navigate(['/500'],{queryParams:{name:'jack'}}) } // 接管参数的两种写法 依据须要来抉择activatedRoute.snapshot.queryParams // {name:'jack'}activatedRoute.queryParams.subscribe(data=>{       //data {name:'jack'}})

vue-router

(未完待续)

1 500/jack

// routes的配置{ path: '500/:name', component: Exception500Component }"500/jack" //地址体现//导航的两种写法<button [routerLink]="['/500','jack']">测试1</button>  navigateTo(){    this.$router.push(['/500/jack'])  }   //接管参数的两种写法 依据须要来抉择this.$route.params // {name:'jack'}

2 /500;name=jack

 //地址体现"/500;name=jack"//导航的两种写法<button [routerLink]="['/500',{name:'jack'}]">测试1</button>navigateTo(){    this.router.navigate(['/500',{name:'jack'}])  }// 接管参数的两种写法 依据须要来抉择activatedRoute.snapshot.params // {name:'jack'}activatedRoute.params.subscribe(data=>{        //data {name:'jack'} })

3 /500?name=jack

"/500?name=jack" //地址体现<button [routerLink]="['/500']" [queryParams]="{name: 'jack'}">测试1</button>navigateTo(){       this.router.navigate(['/500'],{queryParams:{name:'jack'}}) } // 接管参数的两种写法 依据须要来抉择activatedRoute.snapshot.queryParams // {name:'jack'}activatedRoute.queryParams.subscribe(data=>{       //data {name:'jack'}})