1.不带参数的路由配置 及 跳转

//路由配置:

{

name: "a",
path: "/a",
component: a
}
 
页面跳转:
this.$router.push('/a');  
this.$router.push({path:'/a'});
this.$router.push({name:'a'})
 
2.带参数的路由配置及页面跳转 和 接收参数

//路由配置:

{

name: "a",
path: "/a/:userid",
component: a
}
//页面跳转:
this.$router.push({name:'a',params:{userid:123}});    接收: this.$route.params.userid
this.$router.push({path:'/a',params:{userid:123}})   错误,如果提供了 pathparams 会被忽略
this.$router.push({path:'/a/123'});                             接收: this.$route.params.userid
 
this.$router.push({path:'/a?userid=123'})  接收:this.$route.query.userid  ----- 这一项的路由配置 path:'/a' ,不用带参数
 this.$router.push({path:'/a',query:{userid:123}})         接收: this.$route.query.userid ----- 这一项的路由配置 path:'/a' ,不用带参数
 
 
 
 
 
 

vue 路由配置的更多相关文章

  1. vue路由配置,vue子路由配置

    上一篇关于vue环境配置已经写好了!按照操作就行了! 现在一个项目已经部署完成,接下来我们从路由开始! 还记得在初始化项目的时候,有提示是否需要安装vue-router,对没错,vue中路由全靠它! ...

  2. npm vue路由配置

    npm vue路由 复习:1.README.md文件:保存如何使用的命令 (1)     npm install:拷项目时可以不拷node_modules文件,运行该命令时,会自动下载node_mod ...

  3. 【原创】一篇学会vue路由配置 、 动态路由 、多层路由(实例)

    先来看看效果图: 为了方便讲解,我没有使用vue脚手架,如果需要的,可以留言跟我要.不多说开工: 首先,html先组上 <div id="app"> <div&g ...

  4. Vue 路由配置、动态路由

    1.安装 npm install vue-router --save / cnpm install vue-router --save 2.引入并 Vue.use(VueRouter) (main.j ...

  5. vue路由配置

    1.安装 npm install vue-router --save / cnpm install vue-router --save 2.引入并 Vue.use(VueRouter) (main.j ...

  6. Vue路由配置history模式

    我的博客: https://github.com/Daotin/fe-notes/issues vue需要node.js吗? 你可以用 script 标签的形式引入vue.min.js 这样的,不需要 ...

  7. Vue 路由模块化配置

    博客地址:https://ainyi.com/77 企业运营后台页面很多,路由如若不区分模块化配置,所有路由挤在同一个文件将不好维护,所以路由的配置也要模块化 分享两个解决方案 -- Vue 路由配置 ...

  8. vue 路由 以及默认路由跳转

    https://router.vuejs.org/ vue路由配置: 1.安装 npm install vue-router --save / cnpm install vue-router --sa ...

  9. vue 子目录配置,负载均衡 nginx

    1. 我使用的是,腾讯云做负载均衡. 负载均衡配置: https://www.xxxx.com/vue   域名指向的服务器地址:10.10.10.10:80/vue 2. nginx 配置: ser ...

随机推荐

  1. C#中委托的同步和异步有什么区别

    通过定义委托,来实现同步和异步,委托通过Action和Func来实现,记录学习委托的同步和异步的过程 委托的同步方法 委托的Invoke方法用来进行同步调用. static void Main(str ...

  2. 泊爷带你学go -- redis连接池的操作

    package main import ( "common" "fmt" "proto" "strconv" " ...

  3. Strut2第一章

    一.Struts2的执行流程: 用户提交一个请求,服务器接收,交给Struts2的核心过滤器进行处理,Struts2的过滤器调用Struts2的一系列处理器来处理(如:解析struts.xml配置文件 ...

  4. 四:客服端防护HTTP发送请求类

    一.源代码: public class swtDefendOperate{private BackgroundWorker backgroundWorker;//DefendType的值 Verify ...

  5. java 每间隔一段时间执行一段代码

    Java中java.util.Timer类中有若干个schedule的重载方法,其中 void schedule(TimerTask task, long delay, long period ) 安 ...

  6. 2019-04-28-day042-HTML初识

    GET / HTTP/1.1 Host: 127.0.0.1:9001 Upgrade-Insecure-Requests: 1 Accept: text/html,application/xhtml ...

  7. PHP判断引入文件是否引入成功

    $included_files = get_included_files(); foreach ($included_files as $filename) { echo "$filenam ...

  8. 显示react配置

    1. 由于react默认隐藏webpack配置需要手动显示. npm run eject //Are you sure you want to eject? This action is perman ...

  9. StringBuilder

    在程序开发过程中,我们常常碰到字符串连接的情况,方便和直接的方式是通过"+"符号来实现,但是这种方式达到目的的效率比较低,且每执行一次都会创建一个String对象,即耗时,又浪费空 ...

  10. LDAP-HA安装与配置(Keepalived方式实现)

    LDAP部署 安装LDAP(主节点) 安装LDAP Server yum install db4 db4-utils db4-devel cyrus-sasl* krb5-server-ldap -y ...