编程 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 相关文章推荐

javaScript - 如何引入js代码

Mar 09 Javascript

javascript对话框使用方法(警告框 javascript确认框提示框)

Jan 07 Javascript

JS+CSS实现简单的二级下拉导航菜单效果

Sep 21 Javascript

javascript移动开发中touch触摸事件详解

Mar 18 Javascript

jquery插入兄弟节点的操作方法

Dec 07 Javascript

微信小程序通过api接口将json数据展现到小程序示例

Jan 20 Javascript

js基于myFocus实现轮播图效果

Feb 14 Javascript

JS实现的模仿QQ头像资料卡显示与隐藏效果

Apr 07 Javascript

bootstrap 点击空白处popover弹出框隐藏实例

Jan 24 Javascript

webpack v4 从dev到prd的方法

Apr 02 Javascript

jQuery AJAX 方法success()后台传来的4种数据详解

Aug 08 jQuery

vue 兄弟组件的信息传递的方法实例详解

Aug 30 Javascript

解决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 中使用随机数的三个步骤

2006/10/09 PHP

Http 1.1 Etag 与 Last-Modified提高php效率

2008/01/10 PHP

一道求$b相对于$a的相对路径的php代码

2010/08/08 PHP

浅析ThinkPHP的模板输出功能

2014/07/01 PHP

网站防止被刷票的一些思路与方法

2015/01/08 PHP

php实现用手机关闭计算机（电脑）的方法

2015/04/22 PHP

php排序算法实例分析

2016/10/17 PHP

在Thinkphp中使用ajax实现无刷新分页的方法

2016/10/25 PHP

javascript中简单的进制转换代码实例

2013/10/26 Javascript

用js代码改变单选框选中状态的简单实例

2013/12/18 Javascript

JS 新增Cookie 取cookie值删除cookie 举例详解

2014/10/10 Javascript

JQuery自动触发事件的方法

2015/06/13 Javascript

JavaScript中用于四舍五入的Math.round()方法讲解

2015/06/15 Javascript

如何实现移动端浏览器不显示 pc 端的广告

2015/10/15 Javascript

BootStrap Table 分页后重新搜索问题的解决办法

2016/08/08 Javascript

Angular 输入框实现自定义验证功能

2017/02/19 Javascript

微信小程序 Buffer缓冲区的详解

2017/07/06 Javascript

JavaScript new对象的四个过程实例浅析

2018/07/31 Javascript

angularJs复选框checkbox选中进行ng-show显示隐藏的方法

2018/10/08 Javascript

利用百度echarts实现图表功能简单入门示例【附源码下载】

2019/06/10 Javascript

js实现圆形显示鼠标单击位置

2020/02/11 Javascript

vue切换菜单取消未完成接口请求的案例

2020/11/13 Javascript

Python的requests网络编程包使用教程

2016/07/11 Python

MySQL适配器PyMySQL详解

2017/09/20 Python

Python调用C# Com dll组件实战教程

2017/10/12 Python

selenium+python实现自动登录脚本

2018/04/22 Python

详解多线程Django程序耗尽数据库连接的问题

2018/10/08 Python

windows中安装Python3.8.0的实现方法

2019/11/19 Python

印尼穆斯林时尚购物网站：Hijabenka

2016/12/10 全球购物

学年自我鉴定范文

2013/10/01 职场文书

快餐店的创业计划书范文

2014/01/29 职场文书

学校师德承诺书

2014/05/23 职场文书

考试作弊检讨书范文

2015/01/27 职场文书

校友会致辞

2015/07/30 职场文书

会议主持词通用版

2019/04/02 职场文书

docker-compose部署Yapi的方法

2022/04/08 Servers