vue 导航名字切换,刷新页面,路由页面保持一致

当我点击到第二个路由时,刷新当前页面,路由依然保持不变,地址不会因刷新而跳转到第一个路由。

1、

<router-link tag="li" v-for="(item,index) in menu" :key="item.link"

@click.native="tab(index)"

:class="{active:index == num}"

:to="{path:item.link, query:{item:index, userid: userid}}">

<span>{{item.title}}</span>

</router-link>

2、export default {

data () {

    return {

    menu: [{

        link: '/tabone',

        title: '待缴费'

    },{

        link: '/tabtwo',

        title: '办理中'

},{

    link: '/tabthree',

    title: '已办结'

}],

    num: 0

},

    methods: {

        tab: function (index) {

            this.num=index;

        }

    },

mounted: function(){

    if(this.$route.query.item){

        this.num = this.$route.query.item;

        if(this.num == 0) {

            this.router_name = 'tabone';

        } else if(this.num == 1) {

            this.router_name = 'tabtwo';

        } else if(this.num == 2) {

            this.router_name = 'tabthree';

        }

            this.$router.push({path:'/' + this.router_name, query:{item: this.num, userid: this.userid}});

        }else{

            this.num = 0;

            this.$router.push({path:'/tabone', query:{item: this.num, userid: this.userid}});

        }

    }

}

如有更好的解决方案,欢迎讨论哈~

猜你喜欢

转载自my.oschina.net/u/3786097/blog/1799666