Vue怎么通过函数切换路由

问题:Vue怎么通过函数切换路由

思想:

• 直接使用this.$router.replace(’/目标’)来切换路由地址

实现代码

<div id="app">
    <router-link to="/son" tag="div">儿子</router-link>
    <router-link to="/daughter" tag="div">女儿</router-link>
    <router-view></router-view>
</div>
<template id="son">
    <div>
        当前是儿子界面
        <button v-on:click="sonClick">切换到女儿的界面</button>
    </div>
</template>
<template id="daughter">
    <div>
        当前是女儿界面
        <button v-on:click="daughterClick">切换到儿子的界面</button>
    </div>
</template>
<script type="text/javascript">
    var son={
        template: '#son',
        methods: {
            sonClick : function(){
                this.$router.replace("/daughter")
            }
        }
    };
    var daughter = {
        template: '#daughter',
        methods: {
            daughterClick : function(){
                this.$router.replace("/son")
            }
        }
    }
    var router=new VueRouter({
        routes:[
            {path:'/',redirect:'/son'},
            {path:'/son',component:son},
            {path:'/daughter', component: daughter}
        ]
    });
    var vm=new Vue({
        el:'#app',
        data:{

        },
        methods:{

        },
        router:router
    });
</script>