1.准备好两个vue文件
panda.vue
travel.vue
2.写index.js配置文件
import travel from '@/components/travel'
- 1
-
{
-
path: '/travel/:id',
-
name: '测试页面',
-
component: travel
-
}
3.编写跳转前的页面
这是一个点击事件
-
gettravel(id) {
-
this.$router.push({
-
path: '/travel/' + id,
-
})
-
}
-
},
- 1
- 2
- 3
- 4
- 5
- 6
- 7
这里触发事件,并且传递参数
-
<span @click="gettravel(item.spotsid)">
-
<h1>点击tiaoz</h1>
-
</span>
4,编写跳转后的页面接收参数
<div>{{this.$route.params.id}}</div>