vue实现跳转页面(含带有参数)

vue实现跳转页面(含带有参数)

• 实现页面跳转

  this.$router.push({
      name:'HelloWorld',
  })
  

• 实现页面跳转(带参数)

  this.$router.push({
      name:'HelloWorld',
      params:{"p":2}
  })
  

• 标签跳转

  <router-link  :to="{path:'/login'}" ></router-link>
  

• 标签跳转(带参数)

  # 第一种参数
  <router-link :to="'/login/'+123" ></router-link>
  

  # 第二种参数
  <router-link :to="'/login/?uid='+123" ></router-link>
  # 如果多个参数传值
  <router-link :to="{path:'/login',query:{uid:2,status:0}}" ></router-link>
  

• 接收参数

  # 第一种接收参数  路由地址需配置为 
   {
      path: '/login/:uid',
      name: 'login',
      component: login
    }
  let uid = this.$route.params.uid;
  

  # 第二种接收参数  路由地址需配置为
   {
      path: '/login/',
      name: 'login',
      component: login
    }
  let uid = this.$route.query.uid;