编程 Javascript

vue 导航内容设置选中状态样式的例子

Posted in Javascript onNovember 01, 2019

如图所示，我们一般需要切换的时候选中导航给个active样式，

而router-link 标签在选中的时候会自动给整个标签添加一个 router-link-active的class

vue 导航内容设置选中状态样式的例子

可给router-link 标签里面的span、i标签如下设置，非常简单，下面是stylus的写法，不需要的话也可以写成平时的css写法

.router-link-active
  span
  i
   color: red

以上这篇vue 导航内容设置选中状态样式的例子就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持三水点靠木。

vue 导航内容设置选中状态样式的例子

- Author -

Web攻城狮-前端

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

jQuery创建平滑的页面滚动(顶部或底部)

Feb 26 Javascript

js实现左侧网页tab滑动门效果代码

Sep 06 Javascript

jQuery中借助deferred来请求及判断AJAX加载的实例讲解

May 24 Javascript

jQuery解析XML 详解及方法总结

Sep 28 Javascript

深入理解Webpack 中路径的配置

Jun 17 Javascript

详解动画插件wow.js的使用方法

Sep 13 Javascript

Bootstrap图片轮播效果详解

Oct 17 Javascript

微信小程序textarea层级过高的解决方法

Mar 04 Javascript

JS中注入eval, Function等系统函数截获动态代码

Apr 03 Javascript

如何使用three.js 制作一个三维的推箱子游戏

Jul 29 Javascript

JavaScript中遍历的十种方法总结

Dec 15 Javascript

详解Vue3.0 + TypeScript + Vite初体验

Feb 22 Vue.js

解决vue-router 二级导航默认选中某一选项的问题

Nov 01 #Javascript

微信js-sdk 录音功能的示例代码

Nov 01 #Javascript

使用 Angular RouteReuseStrategy 缓存（路由）组件的实例代码

Nov 01 #Javascript

vue实现计步器功能

Nov 01 #Javascript

详解小程序如何改变onLoad的执行时机

Nov 01 #Javascript

js canvas实现星空连线背景特效

Nov 01 #Javascript

jQuery鼠标滑过横向时间轴样式(代码详解)

Nov 01 #jQuery

You might like

php session应用实例登录验证

2009/03/16 PHP

整理的9个实用的PHP库简介和下载

2010/11/09 PHP

让PHP以ROOT权限执行系统命令的方法

2011/02/10 PHP

php 记录进行累加并显示总时长为秒的结果

2011/11/04 PHP

JavaScript类和继承 constructor属性

2010/03/04 Javascript

细说浏览器特性检测(2)-通用事件检测

2010/11/05 Javascript

MyEclipse取消验证Js的两种方法

2013/11/14 Javascript

如何实现textarea里的不同文本显示不同颜色

2014/01/20 Javascript

Jquery 点击按钮自动高亮实现原理及代码

2014/04/25 Javascript

jQuery使用hide方法隐藏页面上指定元素的方法

2015/03/30 Javascript

js学习阶段总结(必看篇)

2016/06/16 Javascript

项目实践一图片上传之form表单还是base64前端图片压缩(前端图片压缩)

2016/07/28 Javascript

微信小程序 MINA文件结构

2016/10/17 Javascript

ES6中箭头函数的定义与调用方式详解

2017/06/02 Javascript

关于vue.js发布后路径引用的问题解决

2017/08/15 Javascript

three.js实现3D视野缩放效果

2017/11/16 Javascript

在vue中封装可复用的组件方法

2018/03/01 Javascript

JS实现网页烟花动画效果

2020/03/10 Javascript

VUE中setTimeout和setInterval自动销毁案例

2020/09/07 Javascript

vue-cli3自动消除console.log()的调试信息方式

2020/10/21 Javascript

python查看微信好友是否删除自己

2016/12/19 Python

Python中scatter函数参数及用法详解

2017/11/08 Python

使用python实现链表操作

2018/01/26 Python

python如何将图片转换为字符图片

2020/08/19 Python

python学生信息管理系统（初级版）

2018/10/17 Python

python3.6.5基于kerberos认证的hive和hdfs连接调用方式

2020/06/06 Python

HTML5 中新的全局属性(整理)

2013/07/31 HTML / CSS

HTML5实现多张图片上传功能

2016/03/11 HTML / CSS

英国领先的男装设计师服装独立零售商：Repertoire Fashion

2020/10/19 全球购物

机电一体化专业推荐信

2013/12/03 职场文书

个人收入证明范本

2014/01/12 职场文书

教师党的群众路线教育实践活动个人对照检查材料

2014/09/23 职场文书

2015年学校关工委工作总结

2015/04/03 职场文书

论语读书笔记

2015/06/26 职场文书

应届生们该怎么书写求职信？

2019/07/05 职场文书

关于JavaScript回调函数的深入理解

2021/06/27 Javascript