动态路由
创建User.vue
代码语言:javascript复制<template>
<div>
<h2>this is {{userId}}!</h2>
</div>
</template>
<script>
export default {
name: "User",
computed:{
userId(){
// 获取传递的参数 这里是route 注意
return this.$route.params.userId;
}
}
}
</script>
<style scoped>
</style>
添加到index.js中
代码语言:javascript复制{
path:'/user/:userId', // 传递参数的占位符
name: 'user',
component:user
}
App.vue中动态传递
代码语言:javascript复制<router-link :to="/user/ userId" replace>用户</router-link>
效果
之前调用跳转的时候用的是router,这个名字是定义路由时的名字