Vue路由vue-router使用this.$router.push();实现页面跳转以及传参。

最新推荐文章于 2024-03-27 18:35:17 发布

L_WalkingPig

最新推荐文章于 2024-03-27 18:35:17 发布

阅读量3k

点赞数 1

分类专栏： Vue 文章标签： vue.js javascript

本文链接：https://blog.csdn.net/L_WalkingPig/article/details/105381124

版权

本文介绍了如何在Vue项目中安装并配置vue-router，通过在main.js中初始化和在App.vue中添加<router-view>标签来设置路由。在具体操作中，展示了在login.vue中使用this.$router.push()方法进行页面跳转，并讨论了path和query参数的使用，以及params传参的限制。此外，还提到了通过v-show控制组件显示的简单示例。

摘要由CSDN通过智能技术生成

自己摸索着加网上找到的文档学习记录的，看着比较多，但是认真看完理解，应该基本对路由就会了(以后可能继续补充)~：D

正文：

首先请确保项目已经安装了vue-router：

运行命令：npm install vue-router --save （也可自行百度）

安装后在项目package.json 文件中查看vue-router版本信息：

"dependencies": {
    "axios": "^0.18.1",
    "element-ui": "^2.13.0",
    "npm": "^6.14.2",
    "vue": "^2.6.11",
    "vue-router": "^3.1.6",
    "webpack": "^3.8.0",
    "webpack-dev-server": "^2.9.7"
},

在项目中新建router文件，外加两个js文件，router.js 和 index.js 用于定义路由和配置路由。