码迷,mamicode.com
首页 > 其他好文 > 详细

vue 动态路由 Get传值

时间:2018-11-26 13:45:45      阅读:209      评论:0      收藏:0      [点我收藏+]

标签:class   商品   path   vue   this   nbsp   color   dir   component   

main.js

 1 //2.配置路由   注意:名字
 2 
 3 const routes = [
 4   { path: ‘/home‘, component: Home },
 5   { path: ‘/news‘, component: News },
 6 
 7   { path: ‘/content/:aid‘, component: Content },   /*动态路由*/
 8 
 9   { path: ‘/pcontent‘, component: Pcontent },
10 
11 
12   { path: ‘*‘, redirect: ‘/home‘ }   /*默认跳转路由*/
13 ]

通过get传值获取路由参数

 1 <template>
 2    
 3     <div id="content">    
 4       商品详情
 5     </div>
 6 </template>
 7 
 8 
 9 <script>
10     
11 
12 
13     export default{
14 
15         data(){
16 
17             return{
18 
19                 msg:数据
20             }
21         },
22         mounted(){
23 
24               //获取get传值
25 
26 
27               console.log(this.$route.query);
28         }
29 
30     }
31 </script>

动态路由获取参数

 1 <template>
 2    
 3     <div id="content">    
 4        我是详情页面
 5     </div>
 6 </template>
 7 
 8 
 9 <script>
10     
11 
12 
13     export default{
14 
15         data(){
16 
17             return{
18 
19                 msg:数据
20             }
21         },
22         mounted(){
23 
24                 console.log(this.$route.params);  /*获取动态路由传值*/
25 
26         }
27 
28     }
29 </script>

 

vue 动态路由 Get传值

标签:class   商品   path   vue   this   nbsp   color   dir   component   

原文地址:https://www.cnblogs.com/Spinoza/p/10019507.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!