话不多说，直接上代码。

关键：通过点击来改变thisindex ，又thisinde == index来控制class是否含active来控制样式

简单效果如下：

vue做nav切换的更多相关文章

  1. vue实现tab切换功能

    最近用vue做一个页面的tab功能,经过一查找资料,没用路由,也没用动态组件,完美实现了tab切换功能,效果如下 下面是代码实现,这是模板 <article id="example&q ...

  2. 使用vue做项目

    使用vue做项目需要用到node.js的npm来管理包 所以我们需要先下载node.js然后通过node的npm来管理包  安装完 nodejs后 我们需要执行 npm install vue-cli ...

  3. vue实现菜单切换

    vue实现菜单切换,点击菜单导航切换不同的内容以及为当前点击的选项添加样式,或者组件. method里: css: html代码: <nav> <ul> <li> ...

  4. 使用Privoxy做智能代理切换

    使用Privoxy做智能代理切换 You take the blue pill, the story ends, you wake up in your bed, and believe whatev ...

  5. 用vue做app内嵌页遇到的坑

    公司要求用vue做一个微信端的网站,其中还包含一些app的内嵌页.开始的时候没想那么多,就直接用vue-cli搭了一个单页的vue项目,可随着项目越做越大,页面越来越多,问题就开始暴露出来了. 众所周 ...

  6. vue做的第二个app

    用vue做应用最好的还是组件的复用上次做饿了吗的app封装了一个评分star的组件只要引入组件传入size大小和score分数就行了,这次做豆瓣直接就就用上了不用重复写代码.不过vue做单页应用全部挂 ...

  7. vue 实现tab切换动态加载不同的组件

    vue 实现tab切换动态加载不同的组件 使用vue中的is特性来加载不同的组件.具体看如下代码:这个功能对于vue比较复杂的页面可以使用上,可以把一个页面的功能拆分出来,使代码更简单.使用方式具体看 ...

  8. vue点击切换颜色限制个数（用了mui框架）

    vue点击切换颜色 只能点击一个 <!doctype html> <head> <meta charset="UTF-8"> <title ...

  9. Vue 做项目经验

    Vue 做项目经验 首先需要知道最基本的东西是: Vue 项目打包:npm run build Vue生成在网页上看的端口:npm run dev 修改端口号的地方在: config文件夹下index ...

随机推荐

  1. 用Nuget部署程序包

    用Nuget部署程序包 Nuget是.NET程序包管理工具(类似linux下的npm等),程序员可直接用简单的命令行(或VS)下载包.好处: (1)避免类库版本不一致带来的问题.GitHub是管理源代 ...

  2. SQL中sysname数据类型的含义（转）

    sysname SQL Server 实例包括用户定义的名为 sysname 的数据类型.sysname 用于表列.变量以及用于存储对象名的存储过程参数.sysname 的精确定义与标识符规则相关:因 ...

  3. GridView用法

    首先,gridview是封装好的,直接在设计界面使用,基本不需要写代码: 1.绑定数据源 GridView最好与LinQDatasourse配合使用,相匹配绑定数据: 2.外观控制 整体控制 自动选择 ...

  4. Linq高级查询，分页查询及查询分页结合

    一.高级查询与分页查询 1.以...开头    StartsWith Repeater1.DataSource=con.Users.Where(r=>r.Nickname.StartsWith( ...

  5. 高版本mysql8.0解压版安装步骤

    解压版安装操作官网下载: mysql-installer-community-8.0.12.0.msi如上操作: http://www.cnblogs.com/elfin/p/9429877.html ...

  6. 针对多条件查询,应对 url 无用 null 值现象处理

    多条件查询 应对 url 无用 null 值现象 处理例如:http://xxoo.b2b.com/orders?city_id=5&repertory_id=7&area_id=39 ...

  7. Hadoop-Impala学习笔记之管理

    配置参数管理 待补充... 资源分配管理(Admission Control) Impala有资源池的概念,允许某些查询在特定的资源池执行,不过在白天不跑批/晚上不跑adhoc的DSS系统中,该机制并 ...

  8. SSM-网站前台博客系统制作（1）---前台+Google的Kaptcha

    前提: 1天半时间简单自己手写了一下前端布局和后台验证码的基本工作,简要说明一下遇到的问题和收获吧. 这次基本就是前台设计(首页)+Kaptcha图片验证码(之前弄了一个reCaptcha验证码 但是 ...

  9. 0x11栈之Editor

    参考链接:https://blog.csdn.net/SSLGZ_yyc/article/details/81700623 对顶栈的思想: 建立两个栈,栈A存储从序列开头到当前光标的位置的一段序列,栈 ...

  10. VC++ 实现程序重启

    转载:https://blog.csdn.net/what951006/article/details/72729448 一.创建一个Win32项目 二.窗口处理函数中,Create窗口时创建一个按钮 ...