vue-router 动态路由匹配

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld,
    },
    {
        //动态路由
      path: '/HelloWorld2/:id',
      name: 'HelloWorld2',
      component: HelloWorld2,
    },
    {
      path: '/HelloWorld3',
      name: 'HelloWorld3',
      component: HelloWorld3,
    },
  ],
  mode: 'history'
});

methods:{
            handleIncrease(){
                this.$store.commit('increase',5);
            },
            handleDecrease(){
                this.$store.commit('decrease',5);
            },
            handleAsyncIncrease(){
                this.$store.dispatch('asyncIncrease');
            },
            handleRouter () {
                //实现跳转的方式2
                this.$router.push('/HelloWorld2/123');
           },
           showRouter (){
               console.log(this.$router);
               console.log(this.$router.push);
           }
        }

<!--显示参数-->
        {{$route.params.id}}

 

转载于:https://www.cnblogs.com/mengfangui/p/9154187.html