记录项目中使用vue路由的一次坑

路由文件( /share是一级路由 )：

  {
    path: '/share',
    component: () => import(/* webpackChunkName: "about" */ '../views/Share.vue'),
    children: [
      {
        path: 'sharelist',
        name: 'Sharelist',
        component: () => import('../components/childcomponents/share/Sharelist.vue')
      },
      {
        path: 'specialist/:cname',
        name: 'Specialist',
        component: () => import('../components/childcomponents/share/Specialist.vue'),
        props: true
      },
      {
        path: '',
        redirect: '/share/sharelist'
      }
    ]
  },

组件内编程式导航+动态路由：

    methods:{
      routerTo(canshu){
        // this.$router.push({name:'Specialist',params:{cname:canshu}});
        //上面这种写法正确但在该项目中由于某些原因没有采用
        const cname = canshu;
        this.$router.push({ path: `/share/specialist/${cname}` });
        //上面的path必须是完整的(localhost:8080后的所有path),错误写法有:
        // this.$router.push({ path: `share/specialist/${cname}` });
        // this.$router.push({ path: `/specialist/${cname}` });
      }
    }