Vue(6)路由组件传参和重定向

路由组件传参

1.路由不解藕
【1】传参连接<router-link to="/user/profile/1">个人信息</router-link>
【2】配置路由{path:'/user/profile/:id',component:UserProfile}
【3】页面获取参数$route.params.id
2.路由解耦
【1】传参连接<router-link to="/user/profile/1">个人信息</router-link>
【2】配置路由{path:'/user/profile/:id',component:UserProfile,props:true}
【3】页面获取参数

<template>
  <div>
    <h1>个人信息</h1>
    {{id}}
  </div>
</template>

<script>
    export default {
      props:['id'],
        name: "profile"
    }
</script>

<style scoped>

</style>

重定向

【1】重定向连接<router-link to="/gohome">回到首页</router-link>
【2】配置路由{path:'/gohome',redirect:'/main'}