vue meta: { active: '/CompletedClasses' }

最新推荐文章于 2022-02-28 22:13:02 发布
最新推荐文章于 2022-02-28 22:13:02 发布
阅读量189 收藏
点赞数
文章标签： javascript ViewUI
原文链接：https://my.oschina.net/u/3950671/blog/3057854
版权

    本来是三个路由，第三个路由下面是三个子路由，点击每个路由，都会有高亮显示，用的vue的router-link-active，这个是在点击相应的router-link,的时候，自动加上这个class名字，在css里面定义这个class，就会出现想要的高亮；

    但是发现，在点击子路由的时候，高亮会消失，找到如下解决办法：

自定义，要高亮显示的路由，在对应的路由上加上路由元信息

html这样写：点击左侧路由的时候，会先检查路由元信息

转载于:https://my.oschina.net/u/3950671/blog/3057854

chiba5074
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Meta标签详解
李建迎的专栏
10-30 721
下面介绍一些有关 标记的例子及解释。 META标签分两大部分：HTTP标题信息(HTTP-EQUIV)和页面描述信息(NAME)。 ★HTTP-EQUIV HTTP-EQUIV类似于HTTP的头部协议，它回应给浏览器一些有用的信息，以帮助正确和精确地显示网页内容。常用的HTTP-EQUIV类型有： 1、Content-Type和Content-Language (显示字符集的设定) 说明：设定页面
element admin 中动态设置快捷导航(标签栏导航)meta标签和title标签
lchmyhua88的博客
11-20 2645
element admin 中动态设置快捷导航(标签栏导航)meta标签和title标签
常用meta整理
nathanhuang1220的专栏
12-05 774
元素 概要 标签提供关于HTML文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。它可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。 —— W3School 必要属性 属性 值 描述 content some text 定义与http-equiv或name属性相关的元信息
vue-router 中的meta是干什莫的呢？
weixin_59519449的博客
12-27 2482
meta的定义：简单来说就是路由元信息，也就是每个路由身上携带的信息。meta的作用：vue-router路由元信息说白了就是通过meta对象中的一些属性来判断当前路由是否需要进一步处理，如果需要处理，按照自己想要的效果进行处理即可 代码： ...
vue中动态设置meta标签和title标签
weixin_43166729的博客
05-14 5442
//router内的设置 { path: '/teachers', name: 'TDetail', component: TDetail, meta: { title:"教师详情", content: 'disable' } }, { path: '/article', ...
解决vue net :ERR_CONNECTION_REFUSED报错问题
10-14
主要介绍了解决vue net :ERR_CONNECTION_REFUSED报错问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue中重定向redirect:‘/index‘,不显示问题、跳转出错的完美解决
10-14
主要介绍了vue中重定向redirect:‘/index‘,不显示问题、跳转出错的完美解决方案，本文通过图文并茂的形式给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友参考下吧
vueAdmin:vue后台管理系统简化模板保存
05-17
vueAdmin模板 具有Element UI，axios，iconfont，权限控制和lint的最小vue管理员模板 现场演示： : 构建设置 # Clone project git clone https://github.com/PanJiaChen/vueAdmin-template.git # Install ...
Vue.js插件，用于处理按钮异步锁定状态。 演示：https://stukh.github.io/vue-promise-btn/-JavaScript开发
05-26
vue-promise-btn示例和文档https://STUkh.github.io/vue-promise-btn/功能易于使用的API灵活使用可在扩展模式下与任何标签甚至表单一起...使用vue导入和“握手”插件从'vue'导入Vue从'vue-promise-btn导入VuePromiseBtn
Vue实现active点击切换方法
01-19
@click=active(index) 2、将索引值传入class（索引等于几就第几个添加active类） :class={active:index==ins} 3、在data里边添加ins：0（表示默认第一个添加active类） data{ ins：0 } 4、最后在methods里边添加...
vue -- 路由元信息（meta）
weixin_43550562的博客
04-14 1085
定义路由的时候可以配置 meta 字段， 我们可以在这里设置一些自定义信息，供页面组件或者路由钩子函数中使用。 route： meta:{ title:'关于' } 路由前置守卫：（我们可以通过 $route.meta.xxxx 获取路由元信息中的数据） 我们可以在钩子函数 router.beforeEach 中获取 meta 中的 title 数据，并设置为页面标题 rou...
vue-router meta（2）页面进入详情页面时，无子项导航栏时，该菜单未高亮。
sepgit的博客
12-10 657
原因 管理系统，左侧导航栏有个单级的菜单（无子一级的菜单），进入后页面显示的是具体的房间列表。点击具体的房间可以进入房间详情页面，展示具体的房间数据。这时页面路由发生变化。发现，导航栏中不存在高亮的选项。 进入导航栏页面 <el-menu ....//其他配置项 :default-active="$route.path" .... </el-menu> 上述列表项 <el-menu-item index="/roomIndex"> <span slo
vue学习-vue router路由配置，元信息meta的使用-登录拦截验证
sinat_39648402的博客
04-22 1148
路由基本配置 1.在router文件夹中找到 indexs.js 注意：如果创建项目是没有安装router，不会有router文件夹，该文件夹在src 文件夹的根目录中 // 1.引入路由以及vue，下面的是固定写法，照写就可以 import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) 2.创建路由实例 ...
Vue-router中meta属性的用法
weixin_45687036的博客
02-28 1万+
Vue-router中meta属性的用法
请教vue-element无法挂在动态路由部分
weixin_42772571的博客
11-07 734
页面展示： 路由表： 主路由配置表： import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) /* Layout */ import Layout from '@/layout' /** * Note: sub-menu only appear when route children.length >...
vue修改meta值_vue中动态设置meta标签和title标签的方法
weixin_32099703的博客
01-13 8774
vue中动态设置meta标签和title标签的方法因为和原生的交互是需要h5这边来提供meta标签的来是来判断要不要显示分享按钮，所有就需要手动设置meta标签，标题和内容//router内的设置{path: '/teachers',name: 'TDetail',component: TDetail,meta: {title:"教师详情",content: 'disable'}},{path: ...
vue-router中meta的作用
青颜的天空的博客
04-29 3万+
meta的定义：简单来说就是路由元信息，也就是每个路由身上携带的信息。 meta的作用：vue-router路由元信息说白了就是通过meta对象中的一些属性来判断当前路由是否需要进一步处理，如果需要处理，按照自己想要的效果进行处理即可 定义路由的时候可以配置 meta 字段： const router = new VueRouter({ routes: [ { path: '/foo', component: Foo, children: [ .
Vue实现active点击切换
热门推荐
小破孩的博客
01-23 6万+
循环的情况： 1、点击时传入index索引（获取当前点击的是哪个） @click="active(index)" 2、将索引值传入class（索引等于几就第几个添加active类） :class="{active:index==ins}" 3、在data里边添加ins：0（表示默认第一个添加active类） data{ ins：0 } 4、最后在methods里边添加方法 act...
vue中如何使http://localhost:8080/article/ffg路径自动跳转到http://localhost:8080/article
最新发布
05-23
在Vue中可以通过`vue-router`来进行路由管理和跳转。在`vue-router`中，...注意，这里的重定向规则只能匹配到`/article/:id`这个路径，如果需要将其他类似的路径也自动跳转到`/article`，则需要添加多条重定向规则。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值