<el-menu :default-active="$route.path" router mode="horizontal">
<el-menu-item v-for="route in routes" :key="route.path"
:index="route.path" :class="$route.path==route.path?'is-active':''">{{route.name}}

routes: [
{ path: '/main/kdgadmin', name: '幼儿园管理', },
{ path: '/main/phyex', name: '体测', },
]
css:
.is-active{
background: #a3212f;
border-bottom: 0px solid transparent;
color: #FFFFFF;
}

本地localStorage:
localStorage.Id= response.data.Meta.Id;
localStorage.getItem("Id"),

url截取参数:
path: '/info?ChildId=' + id + '&ChildName=' + childname
ChildId= this.$route.query.ChildId;

vue路由\导航刷新后:ative\localStorage\url截取参数的更多相关文章

  1. python 将中文转拼音后填充到url做参数并写入excel

    闲着没事写了个小工具,将中文转拼音后填充到url做参数并写如excel 一.先看下演示,是个什么东西 二.代码 代码用到一个中文转拼音的库,库是网上下的,稍微做了下修改,已经找不原来下载的地址了,然后 ...

  2. Vue 参数传递及刷新后依旧存在

    获取参数方式有两种: 1.params2.query 第一种方式: params this.$router.push({name:'Hello',params:{name:'zs',age:'22'} ...

  3. vue路由导航守卫及前置后置钩子函数参数详解

    首先构建一个测试demo如下图: 接着来探讨路由配置界面 import Vue from 'vue' import Router from 'vue-router' // import HelloWo ...

  4. vue 路由导航白话全解析

    这里先放上官网的教程和说明:点击这里,vue导航守卫官方文档 路由守卫 路由守卫说白了就是路由拦截,在地址栏跳转之前 之后 跳转的瞬间 干什么事 全局守卫 全局守卫顾名思义,就是全局的,整个项目所有路 ...

  5. Vue 路由导航解析流程

    Vue Router完整的导航解析流程

  6. vue路由切换和用location切换url的区别

    最近的业务涉及到了axios的拦截器,要在request.js里面要根据状态码来跳转页面,这时候我就面对了几种跳转选择: 1.使用location.href='/url'来跳转,简单方便,但是刷新了页 ...

  7. 1:时间戳转换成年月日函数,2:url截取参数方法,3:弹窗自定义方法 4:点击按钮加入购物车

    最近一直在使用vue.js来构建项目,先分享一下一些简单可复用的函数. 1:时间戳转换Date.prototype.format = function(fmt){ //author: yumeiqia ...

  8. URL 截取参数 正则

    用处很多,记录下. function getvl(name) { var reg = new RegExp("(^|\\?|&)"+ name +"=([^&am ...

  9. vue路由的钩子函数和跳转

    首页可以控制导航跳转,beforeEach,afterEach等,一般用于页面title的修改.一些需要登录才能调整页面的重定向功能. beforeEach主要有3个参数to,from,next. t ...

随机推荐

  1. 开发测试技巧|辅助开发调试:goolge浏览器利用F12在控制台输入脚本实现表单自动填充

    一个开发测试技巧的指引和截图,利用google浏览器的F12调试和Console执行,注入JavaScript脚本实现表单的自动填充和测试. 原文链接: http://www.lookdaima.co ...

  2. java基础-温故而知新(02)

    基本数据的自动拆装箱及享元设计模式 1.1 自动装箱        -128~127 之间的整数,装在一个内存区域.         超过这个范围的整数,装在不同的内存区域. 1.2 自动拆箱     ...

  3. fedora添加ntfs文件系统支持

    ntfs支持(安装后不能打开,重启) 如果没有换源先看一下换源. 查找库中是否有ntfs-3g. [root@bogon zhujikuan]# yum search ntfs 上次元数据过期检查:0 ...

  4. Java设计模式之十三 ---- 观察者模式和空对象模式

    前言 在上一篇中我们学习了行为型模式的备忘录模式(Memento Pattern)和状态模式(Memento Pattern).本篇则来学习下行为型模式的最后两个模式,观察者模式(Observer P ...

  5. final 关键字的作用及应用案例

    final关键字的作用如下: 1.可以修饰成员变量,但不能对该成员变量进行修改: 2.可以修饰局部变量,但不能地该局部变量进行修改: 3.可以修饰成员方法(继承),但不能对父类成员方法进行重写: 4. ...

  6. WebService Client Generation Error with JDK8

    java.lang.AssertionError: org.xml.sax.SAXParseException; systemId: jar:file:/path/to/glassfish/modul ...

  7. GUI_菜单练习

    package com.mywindow.test; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; ...

  8. Mysqldumpslow的用法汇总

    mysqldumpslow --help可显示其参数的使用 经常使用的参数: -s,是order的顺序 al   平均锁定时间 ar   平均返回记录时间 at   平均查询时间(默认) c    计 ...

  9. Vue仿抽屉

    创建VUE项目的步骤: npm install vue-cli -g vue init webpack myproject cd myproject npm run dev 组件:它是可扩展的html ...

  10. <数据结构与算法分析>读书笔记--数学知识复习

    数学知识复习是<数据结构与算法分析>的第一章引论的第二小节,之所以放在后面,是因为我对数学确实有些恐惧感.不过再怎么恐惧也是要面对的. 一.指数 基本公式: 二.对数 在计算机科学中除非有 ...