这篇文章主要介绍了浅谈vue-router 路由传参的方法，现在分享给大家，也给大家做个参考。
路由传参数。在很多时候我们需要路由上面传递参数，比如新闻列表页，我们需要传递新闻ID，给新闻详细页。
1.新闻列表页模板
<template id="news">
<p>
<h2>新闻列表</h2>
<ul>
<li>
<router-link to="/news/001">新闻001</router-link>
</li>
<li>
<router-link to="/news/002">新闻002</router-link>
</li>
</ul>
</p>
</template>我们访问/news/001，跳转到新闻详细页，展示001的这条新闻。
2.新闻详细页组件准备
<template id="NewsDetail">
<p>
新闻详细页面
<span>{{$route.params.id}}</span>
</p>
</template>$route.params.id获取路由上的参数
3.定义路由，增加一个路由
{ path: '/news/:id', component: NewsDetail },4.全部代码如下：
home news
首页
登录 注册
新闻列表
新闻001 新闻002 登录界面
注册界面
新闻详细页面 {{$route.params.id}}
上面是我整理给大家的，希望今后会对大家有帮助。
相关文章：
以上是在vue-router中如何实现路由传参的详细内容。更多信息请关注PHP中文网其他相关文章！
