VUE-路由传递、接受参数

 

传递参数

user路由定义

{
    path:'/user/:id',
    meta: {
      title: '个人主页'
    },
    component:(resolve) => require(['./views/user.vue'],resolve)
  }

 

触发路由跳转并传递参数

//路由跳转
this.$router.push('/user/123');

 

 

接受参数

<template>
    <!--从路由中获取传过来的参数-->
    <div>{{ $route.params.id }}</div>
</template>

<script>
    export default {
        //组件HTML都渲染完后执行，可以操作dom
        mounted(){
          console.log(this.$route);
        }
    }
</script>

<style scoped>

</style>

说明：

    1）接受路由传递过来的参数，{{ $route.params.id }}；