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;