动态路由vue-router
动态路由传参
效果：由 test 路由跳转到testNew路由
test页面
<h1>test页面</h1>
<button @click="$router.push({path:'testNew/1'})">跳转testNew路由</button>
testNew页面
<template>
<div>
<h1>testNew页面</h1>
</div>
</template>
<script>
export default {
created() {
console.log(this.$route.params.id,'this.route.params.id') //获取动态路由传递过来的值 1
}
}
</script>
路由配置router.js
{
path: '/test',
routeName: '测试',
component: () => import('@/views/test')
},
{
path: '/testNew/:id',
routeName: '测试',
component: () => import('@/views/testNew')
},