vue动态路由

vue动态路由路由表

使用场景一般是做详情页

<div id="app">
       <router-link to="/b">排球</router-link>
       <router-link to="/football">篮球</router-link>
       <router-link to="/ppq">足球</router-link>
       <router-view></router-view>
    </div>

<script>
var Ball = {
            template:'<div>球组件{{$route.params.id}}</div>'
        }
       
        var router = new VueRouter({
            routes:[
                {
                    //动态路由
                    //:id参数名变化的
                    path:'/:id',
                    component:Ball
                }

            ]
            
        })

        new Vue({
            el:'#app',
            router,
            data(){
                return{

                }
            },
            mounted:{
              
            }
        })
    </script>