zoukankan      html  css  js  c++  java
  • 嵌套路由

    嵌套路由指的是在动态路由的基础上再加上附加的嵌套URL(即组件)。

    <template>
        <div>
            <p>{{msg}}</p>
            <router-link :to="profile">简介</router-link>
            <router-link :to="stats">数据</router-link>
            <router-view></router-view>
        </div>
    
    </template>
    <script>
        export default{
            name:'player',
            data(){
                return {
                    msg:{},
                    profile:'',
                    stats:''
                }
            },
            mounted(){
                this.msg=this.getPlayer(this.$route.params.uid);
                this.profile='/player/'+this.$route.params.uid+'/profile';
                this.stats='/player/'+this.$route.params.uid+'/stats';
            },
            beforeRouteUpdate(to,from,next){
                this.msg=this.getPlayer(to.params.uid);
                this.profile='/player/'+to.params.uid+'/profile';
                this.stats='/player/'+to.params.uid+'/stats';
                next();    
            },
            methods:{
                getPlayer(uid){
                    switch (uid) {
                        case '1':
                            return {id:1,name:'哈登'};
                            break;
                        case '2':
                            return {id:2,name:'姚明'};
                            break;
                        default:
                            return {id:-1};
                            // statements_def
                            break;
                    }
                }
            }
    
        }
    </script>
  • 相关阅读:
    第一章:简介
    2018年10月底新公司
    第四章:集成
    第三章:如何建模服务
    第二章:演化架构师
    第一章:微服务
    4、工厂模式
    5、单例模式
    8、模板方法模式
    3、字典介绍
  • 原文地址:https://www.cnblogs.com/m-yk/p/9797896.html
Copyright © 2011-2022 走看看