最近做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设置路由跳转参数,以及接收参数的更多相关文章

  1. Vue设置路由跳转的两种方法: <router-link :to="..."> 和router.push(...)

    一.<router-link :to="..."> to里的值可以是一个字符串路径,或者一个描述地址的对象.例如: // 字符串 <router-link to= ...

  2. Vue.之.路由跳转

    Vue.之.路由跳转 在进行项目开发的过程中,需要使用路由进行跳转.如下: // 不带有参数,在页面上跳转到别的页面 1. this.$router.push('/login/init');  // ...

  3. Jquery Datatables 请求参数及接收参数处理

    Jquery Datatables 请求参数及接收参数处理 /** * Created by wb-wuyifu on 2016/8/9. */ /** * Created by wb-wuyifu ...

  4. vue 所有的路由跳转加一个统一参数

    需求是什么 所有的路由跳转加一个统一的参数 实现方式 先深入理解一下router的全局前置守卫 router.beforeEach((to, from, next) => { const que ...

  5. Vue之路由跳转 传参 aixos 和cookie

    一.路由跳转 1.1 项目的初始化 vue create m-proj   >>>创建vue项目 精简vue项目的 views 视图   About(基本是删除的) Home.(可以 ...

  6. vue二级路由跳转后外部引入js失效问题解决方案

    vue路由可以通过children嵌套,于是可以形成二级路由等等... 案例如下: routes: [ { path: '/', name: 'dy', component: dy, children ...

  7. vue当前路由跳转初步研究

    一样闲话少说,直接上问题,如图: 也是消息面板,没想到一个小小的消息面板,碰到这么多坑,惆怅. 就是如果当前路由和跳转路由不一样时,正常跳转没有任何问题.但是如果一样时,就不会跳转了,用了很多方法,比 ...

  8. vue -- router路由跳转错误 , NavigationDuplicated

    vue-router ≥3.0版本回调形式以及改成promise api的形式了,返回的是一个promise,如果路由地址跳转相同, 且没有捕获到错误,控制台始终会出现如图所示的警告 (注:3.0以下 ...

  9. uploadify上传带参数及接收参数的方法

    function uploadify() { $("#uploadify").uploadify({ method:'post', uploader: '/Manage/Order ...

随机推荐

  1. VB中获取网页数据

    以下是在Microsoft Visual Basic 6.0 中文版下做的 VB可以抓取网页数据,所用的控件是Inet控件. 第一步:单击工程-->部件 选择Microsoft Internet ...

  2. asdasf

    bigFile = open('big.txt',mode='r',encoding='utf-8') bigText = bigFile.read() bigFile.close() print(b ...

  3. 使用JBolt新建Maven版工程步骤

    一.打开新建对话框 在左侧右键new中可以找到JFinal创建工程的菜单 JBoltHome页面也有快捷按钮用来弹出创建工程对话框. 二.填写Maven和其他信息配置 填写工程name 主包名 下面有 ...

  4. eclipse运行无错的ssm项目,迁移到idea出错

    我的报错信息为mapper绑定相关错误,是因为idea在构建项目时,target/classes目录下不存在mapper.xml文件 解决方法: <!-- 在maven中添加以下配置,它的父标签 ...

  5. JavaScript对象(第四天)

    面向对象编程中,JavaScript并不完全具备封装.继承.多态:在JavaScript中,对象是一个无序的键值对集合 封装JavaScript是具备的,将属性和方法定义到对象内部: 继承,在java ...

  6. CSS 中的 !important 属性

    !important的作用就是提高指定样式属性的优先级. 一般情况下,我们对同一个元素设置样式属性的时候,对同一个属性设置了两个甚至多个值,像下面这样: p { /* 例1 */ color:red; ...

  7. sosreport-汇总收集linux系统信息

    有时候我们想将Linux服务器信息一次性查询并导出发送给他人,我们可以使用这个sosreport这个工具 安装  yum install sos -y 收集信息 sosreport 收集到的信息默认保 ...

  8. Hot Chocolate 一个.net 平台的graphql 框架

    在看昨天发布的新版技术雷达中,看到了一个.net 的graphql 框架Hot Chocolate 还是比较激动,尽管好久不搞 .net 了,但是这个框架还是值得看看的,后边学习下 参考资料 http ...

  9. git 放弃本地修改,强制拉取更新

    开发时,对于本地的项目中修改不做保存操作(或代码改崩),可以用到Git pull的强制覆盖,具体代码如下: git fetch --all git reset --hard origin/master ...

  10. Redis 单机部署

    参考文章: https://www.cnblogs.com/zy-303/p/10273167.html#_label0 https://blog.csdn.net/linyifan_/article ...