话不多说,直接上代码。

关键:通过点击来改变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. [动态规划]数字三角形(版本I-III)

    level 1 1.1题目 1.1.1题目描述 考虑在下面被显示的数字金字塔. 写一个程序来计算从最高点开始在底部任意处结束的路径经过数字的和的最大.每一步可以走到左下方的点也可以到达右下方的点. 在 ...

  2. 用Cocos2dx开发棋牌游戏的观点解析

    众所周知,目前棋牌游戏特别的火.很多游戏公司都想在这一块赚钱,可是却不知用什么软件比较好的去开发棋牌游戏,对此,我列出了两款比较靠谱的软件去开发棋牌游戏,希望对大家有帮助! 第一款软件是cocos2d ...

  3. Hadoop 进程配置总结

    HDFS: NameNode: core-site.xml <property> <name>fs.defaultFS</name> <value>hd ...

  4. VDSR

    提出SRCNN问题 context未充分利用 Convergence 慢 Scale Factor 训练指定fator的模型再重新训练其他fator的模型低效 context 对于更大的scale-f ...

  5. Java 数据返回接口封装

    enum StatusCode package com.lee.utils; public enum StatusCode { SUCCESS(20000, "成功"), FALL ...

  6. Git随笔 -- 初始化远程仓库

    1. 新建文件夹(作为本地仓库与之远程仓库关联),进入文件夹空白处右键选择Git Bash(安装程序下载).[或者在开始菜单里找到Git Bash并打开,使用命令进入文件夹:cd 文件夹名称.] 2. ...

  7. 51行代码实现简单的PHP区块链

    本文原始地址:php区块链demo 今年区块链特别火,我也很火啊.我火什么呢.前几年,公众平台出现,还得花时间去学去看,后来小程序出现,又得花时间精力去学去看.现在比特币.以太坊等去中心化货币带起了区 ...

  8. 20175307《Java程序设计》第5周学习总结

    教材内容总结 6.1  接口 1接口声明 接口使用关键字interface来进行声明 eg:interface  接口的名字 2接口体 接口体中包含常量的声明和抽象方法两部分(没有变量) 注意一定的要 ...

  9. 王之泰201771010131《面向对象程序设计(java)》第十四周学习总结

    第一部分:理论知识学习部分 第12章 Swing用户界面组件 12.1.Swing和MVC设计模式 a 设计模式初识b 模型—视图—控制器模式c Swing组件的模型—视图—控制器分析 12.2布局管 ...

  10. zabbix触发器表达式

    zabbix触发器表达式 触发器使用逻辑表达式来评估通过item获取的数据是处于哪种状态, 触发器中的表达式使用很灵活,我们可以创建一个复杂的逻辑测试监控,触发器表达式形式如下: {<serve ...