计划一 路由前面跟参数
特点：
1 参数在地址栏中显示。2 刷新页面，参数不会隐没。
案例：
代码示例：
------------------------------router.js------------------------------------------const routes = [ { path: '/news/:newsId', // 路由前面跟上自定义参数变量 name: 'News', component: () => import( '../views/news.vue') }]------------------------------跳转链接--------------------------------------------<router-link to="/news/a1b2c3d4e5">新闻</router-link> // 路由前面间接跟上参数或者// 特地留神：这种形式跳转将导致新闻组件生命钩子不会触发。可通过其余办法解决此问题。，此处只是阐明路由传参的用法<button @click="jumpToNews('1a2b3c4d')">跳转到新闻页</button>jumpToNews(param){ this.$router.push({ path:`/news/${param}`})}----------------------------新闻组件获取路由参数--------------------------------------mounted(){ this.newsId = this.$route.params.newsId // 通过$route.params获取指定参数（变量）},
计划二 $router.push({ path:' ', query:{ id:''} })
特点：
1 参数在地址栏中显示。2 刷新页面，参数不会隐没。
案例：
代码示例：
--------路由--------------------------------------const routes = [ { path: '/news', name: 'News', component: () => import( '../views/news.vue') }]--------跳转办法----------------------------------- jumpToNews(param){ this.$router.push({ path:`/news`, query:{newsId:param}}) } --------新闻组件获取路由参数----------------------- mounted(){ this.newsId = this.$route.query.newsId },
计划三 匹配路由中name属性，并通过params传参
特点：
1 参数不会在地址栏中显示。2 刷新页面，参数隐没。
案例：
代码示例：
--------路由--------------------------------------const routes = [ { path: '/news', name: 'News', component: () => import( '../views/news.vue') }] --------跳转办法-----------------------------------jumpToNews(param){ this.$router.push({ name: 'News', params:{newsId:param}})} --------新闻组件获取路由参数------------------------ mounted(){ this.newsId = this.$route.params.newsId },