最近在学习Vue，准备写一个Vue系列。本篇经验就描述如何使用vue-router从列表页面跳到明细页面并传递参数。
工具/原料
1
VS Code
2
Chrome
3
Power Shell
方法/步骤
1
首先，我们需要安装vue router。在power shell中，进入项目所在目录，输入“npm install vue-router”命令安装vue-router。这里我的项目名称为'hello-world'。安装完成后，在package.json文件中可以看到vue-router的依赖。
2
修改项目下的main.js文件，引入vue-router。
3
如图为我AnimalList.vue文件。我们使用this.$router.push方法跳转到详情页面。
4
如图为我AnimalDetail.vue文件。通过this.$route.params.name获取name，然后展示详情到页面中。
5
输入'npm run dev'启动项目。
6
在浏览器中可以查看到页面。
注意事项
1
喜欢我的文章，别忘了点赞+收藏哦！
2
不花一分钱，小小“点赞+收藏”就是笔者更新的动力！配合分享效果更佳哦～