声明式
<router-link :to="...">
编程式
router.push(...)

router.push('home')                 // 字符串

router.push({ path: 'home' })   // 对象

router.push({ name: 'user', params: { userId: 123 }})     // 命名的路由
router.push({ path: 'register', query: { plan: 'private' }})  // 带查询参数,变成 /register?plan=private

$route.path 当前路由对象的路径,如'/view/a' $rotue.params 关于动态片段(如/user/:username)的键值对信息,如{username: 'paolino'}
$route.query 请求参数,如/foo?user=1获取到query.user = 1 $route.router 所属路由器以及所属组件信息
$route.matched 数组,包含当前匹配的路径中所包含的所有片段所对应的配置参数对象。
$route.name 当前路径名字

router.replace(location)
跟 router.push 很像,唯一的不同就是,它不会向 history 添加新记录,而是跟它的方法名一样 —— 替换掉当前的 history 记录。
声明式
<router-link :to="..." replace>
编程式
router.replace(...)

router.go(n)
router.go(1) // 在浏览器记录中前进一步,等同于 history.forward()
router.go(-1) // 后退一步记录,等同于 history.back()
这两种方式都会把路由导航到 /user/123 路径。
<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>
router.push({ name: 'user', params: { userId: 123 }})

vue2.0路由(跳转和传参)经典介绍的更多相关文章

  1. vue 路由跳转,传参

    一.直接跳转 //js1.this.$router.push('/ad_new') //html 2.<router-link to="/ad_check"> < ...

  2. vue 和 react 路由跳转和传参

                      react  1 .跳转方式加传参 this.props.history.push({ //地址 pathname: '/film/Details', //路由传参 ...

  3. Angular:路由的配置、传参以及跳转

    ①路由的配置 1.首先用脚手架新建一个项目,在路由配置时选择yes 2.用ng g component创建组件 3.在src/app/app-routing.module.ts中配置路由 import ...

  4. vue2.0路由写法、传参和嵌套

    前置知识请戳这里 vue-routerCDN地址:https://unpkg.com/vue-router@3.0.1/dist/vue-router.js vue-router下载地址:https: ...

  5. JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参

    <script src="jquery.min.js" type="text/javascript"></script> <scr ...

  6. vue2.0路由

    现在用vue-cli搭建的环境里面vue-router是下载好的 vue2.0路由方式和以前也有些不同 没了了map和start方法 目录结构如上图 这里有三个文件,app.vue显示,main.js ...

  7. (day68)Vue-CLI项目、页面跳转和传参、生命周期钩子

    目录 一.Vue-CLI (一)环境搭建 (二)项目的创建 (三)项目目录结构 (四)Vue组件(.vue文件) (五)全局脚本文件main.js(项目入口) (六)Vue请求生命周期 二.页面跳转和 ...

  8. flutter页面间跳转和传参-Navigator的使用

    flutter页面间跳转和传参-Navigator的使用 概述 flutter中的默认导航分成两种,一种是命名的路由,一种是构建路由. 命名路由 这种路由需要一开始现在创建App的时候定义 new M ...

  9. app之间的跳转和传参问题

    app 之间跳转和传参: 首先 创建2个app   formApp (需要跳转到另外app的项目)     toApp(被跳转的项目) 一:在toApp 项目中的操作: 1:创建URLSchemes ...

  10. 微信小程序开发:学习笔记[8]——页面跳转及传参

    微信小程序开发:学习笔记[8]——页面跳转及传参 页面跳转 一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面.在首页使用2次wx.navigateTo后,页面层级会有三层 ...

随机推荐

  1. iPhone 3gs 5.0.1降級到4.3.3 昨晚搞定(有shsh備份)

    經過昨天白天一天的學習和準備,終於一次降級成功. 手機未降級時狀態: 無鎖港版   3GS 16G  固件:5.0.1  基帶:05.16.05 記錄且分享降級完整步驟: 準備以下軟件.工具 官網固件 ...

  2. AHCI IDE

    AHCI模式性能好 IDE模式,提高约20%,使用Windows 7 系统,AHCI 模式是最佳选择,特别是对SSD硬盘IDE是为XP的兼容性,RAID 模式是要有两块以上硬盘才能实现AHCI模式装的 ...

  3. vue中slot的笔记

    一言以蔽之:本来写在子组件里边的内容默认是不显示的,如果想相对于子组件在哪里进行显示,则使用slot标签代表占位符,代替那部分内容,是行间元素还是块级元素取决于原先的那个标签. 参考的连接是:http ...

  4. ExtJS ComboBox 下拉列表详细用法

    ExtJS ComboBox 下拉列表详细用法 标签: combobox 2015-06-14 23:23 5171人阅读 评论(2) 收藏 举报  分类: ExtJS(32)    目录(?)[+] ...

  5. Codeforces Beta Round #2 B. The least round way

    这个2B题还好~~ 题目大意: 给出一个矩阵.从左上走到右下,仅仅能往右或下走.路径中每一个格子有一个数.这些数相乘得出一个数. 求这个数末尾零最少的一条路径. 解题思路: 找出一条路径.乘积得数中素 ...

  6. Deferred Rendering(二)G-Buffer的组织

    先来看一张网上广为流传的<杀戮地带2>典型的Deferred Shading的G-Buffer组织: 这里补充解释下几个点: 不存Position,而由depth和屏幕像素坐标反推出来.參 ...

  7. 2016/1/18 Java开发中的23种设计模式详解(转)

    设计模式(Design Patterns) ——可复用面向对象软件的基础 设计模式(Design pattern)是一套被反复使用.多数人知晓的.经过分类编目的.代码设计经验的总结.使用设计模式是为了 ...

  8. SepicalJudge

    原文:http://www.cnblogs.com/chouti/p/5752819.html Special Judge:当正确的输出结果不唯一的时候需要的自定义校验器 首先有个框架 #includ ...

  9. 昆石VOS3000_2.1.2.0完整安装包及安装脚本

    安装包下载地址 http://www.51voip.org/post/57.html 安装教程: 上传安装包 ·给整个目录授权 chmod 777 /root/vosintsall 1.安装前准备 首 ...

  10. bzoj 1646: [Usaco2007 Open]Catch That Cow 抓住那只牛【bfs】

    满脑子dp简直魔性 模拟题意bfs转移即可 #include<iostream> #include<cstdio> #include<queue> using na ...