vue设置路由跳转参数,以及接收参数
最近做Vue项目,遇到了一个路由跳转问题:首页要跳转到项目页指定的Tab选项卡项,一开始总是跳到默认项。解决方法如下:
在跳转链接处设置了路由跳转参数,如下:
<router-link :to="{path:'/project',query:{tab:0}}" >项目页</router-link>
然后在project页接收query传递过来的参数,methods里写一个方法:
cc:function(){
var tabId = this.$route.query.tab;
this.index = tabId; //index为控制切换的参数
},
然后把这个方法放到mounted(){}中执行
注:tab的值是你在选项卡中写的参数,比如你设置了一个变量index,index=0是,显示第一个选项卡的内容。
vue设置路由跳转参数,以及接收参数的更多相关文章
- Vue设置路由跳转的两种方法: <router-link :to="..."> 和router.push(...)
一.<router-link :to="..."> to里的值可以是一个字符串路径,或者一个描述地址的对象.例如: // 字符串 <router-link to= ...
- Vue.之.路由跳转
Vue.之.路由跳转 在进行项目开发的过程中,需要使用路由进行跳转.如下: // 不带有参数,在页面上跳转到别的页面 1. this.$router.push('/login/init'); // ...
- Jquery Datatables 请求参数及接收参数处理
Jquery Datatables 请求参数及接收参数处理 /** * Created by wb-wuyifu on 2016/8/9. */ /** * Created by wb-wuyifu ...
- vue 所有的路由跳转加一个统一参数
需求是什么 所有的路由跳转加一个统一的参数 实现方式 先深入理解一下router的全局前置守卫 router.beforeEach((to, from, next) => { const que ...
- Vue之路由跳转 传参 aixos 和cookie
一.路由跳转 1.1 项目的初始化 vue create m-proj >>>创建vue项目 精简vue项目的 views 视图 About(基本是删除的) Home.(可以 ...
- vue二级路由跳转后外部引入js失效问题解决方案
vue路由可以通过children嵌套,于是可以形成二级路由等等... 案例如下: routes: [ { path: '/', name: 'dy', component: dy, children ...
- vue当前路由跳转初步研究
一样闲话少说,直接上问题,如图: 也是消息面板,没想到一个小小的消息面板,碰到这么多坑,惆怅. 就是如果当前路由和跳转路由不一样时,正常跳转没有任何问题.但是如果一样时,就不会跳转了,用了很多方法,比 ...
- vue -- router路由跳转错误 , NavigationDuplicated
vue-router ≥3.0版本回调形式以及改成promise api的形式了,返回的是一个promise,如果路由地址跳转相同, 且没有捕获到错误,控制台始终会出现如图所示的警告 (注:3.0以下 ...
- uploadify上传带参数及接收参数的方法
function uploadify() { $("#uploadify").uploadify({ method:'post', uploader: '/Manage/Order ...
随机推荐
- 十个有意思的Github Page
1. Cooolis.github.io Cooolis是一个操作系统命令技巧备忘录 2. rfrd-tw.github.io 2018 台灣公投視覺化 3. confpad.github.io Co ...
- Mybatis集成Oracle
首先需要导入Oracle的驱动,这部分会有一个天坑 Maven无法直接将我们所需的Oracle驱动加入项目中,手动加入依赖也是无效(原因还在分析),而且驱动无效如果不注意的话是看不出来的,他不会在编译 ...
- Qt学习3---子窗口与父窗口
创建子窗口后,主窗口的头文件需要 #include "子窗口头文件" 子窗口和父窗口之间相互切换 子窗口没有办法处理父窗口,子窗口此时就需要一个信号: * 信号必须有signal ...
- xxxx征集系统项目目标文档
分组:每四人一组 主题:xxx征集系统 成果: 讨论结束后,每组提交一份课堂讨论记录(电子版发表到博客上,纸质版小组成员签名,下节课提交). 每人根据课堂讨论结果提交一份系统利益相关者描述案例.撰写项 ...
- 随笔:关于Class.getSimpleName()
最近学习过程中,遇到了Class.getSimpleName()这个方法,就搜索了一些资料: API定义: Class.getName():以String的形式,返回Class对象的"实体& ...
- IntelliJ IDEA 实用快捷键
psvm--------------主(main)-----------------public staitc void main(String[] args) sout--------------- ...
- 关于使用git上传远程仓库的两种情况(新项目与老项目)
具体的git配置与github仓库ssh配置在这里就不再赘述,本次只讲自己之前遇到的两个内容 1.还没有项目,将远程仓库clone下来直接在里边写项目. 2.已有项目,将已有的项目直接添加到建立好的远 ...
- Java修饰符final总结
final 的意思是最终的,不可改变的. final可以用来修饰 a.类. b.方法(包括类方法和对象方法). c.变量(包括成员变量.局部变量). 1. final修饰类: 用final修饰的类不能 ...
- NodeJS 学习笔记
1. NodeJs的事件模型被称为非阻塞式IO或者事件驱动IO 2. Node.js 几乎每一个 API 都是支持回调函数的. 3. Node.js 基本上所有的事件机制都是用设计模式中观察者模式实现 ...
- TCP 选项RST
1.RST介绍 RST表示reset复位,用于异常情况下关闭连接. 发送RST包关闭连接时,不必等缓冲区的包都发出去,直接就丢弃缓冲区中的包. 而接收端收到RST包后,也不必发送ACK包来确认. 2. ...