路由的跳转，传参，钩子函数

跳转的两种方法

 methods:{
    tz(){
     /*  this.$router.push('/about') */
      this.$router.push({name:"childA"})
    },

连续点击跳转会报错，解决方法是在index.js中添加下面这段代码

const VueRouterPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (to) {
  return VueRouterPush.call(this, to).catch(err => err)
}

添加vip路由

addR(){
      this.$router.addRoute({
        path:"/vip",
        name:"vip",
        component:() => import('@/views/VipView.vue')
      })
    },

添加子路由

 addR2(){
      this.$router.addRoute('childA',{
        path:"/add",
        name:"add",
         component:() => import('@/views/addView.vue')
      })
    } 

传参第一种方式

在被传参的页面接受参数并做些事情

 watch:{
    $route:{
      handler:function(){
        let name = this.$route.query.name;
        if(name=='zhangsan'){
          this.msg = 'zhagsan'
        }
      }
    }
  }

第二种方法

在jindex.js中添加

在被传参的页面接受参数并做些事情

  watch: {
    $route: {
      immediate: true,
      handler() {
        console.log(this.id);
        if (this.id == "1") {
          this.msg = "111111111";
        } else if (this.id == "2") {
          this.msg = "222222222222";
        }
      },
    },
  },