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


Posted in Javascript onNovember 01, 2019

现在有一个需求是这样的:

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

这个需求很正常吧! 二级导航条,不是二级路由的(如果是二级路由是用linkActiveClass来做,我之前文章说过),是单纯获取数据的按钮,当这个页面出现时,默认选中第一项。

首先:

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

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

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

上面的判断的意思是:如果你点击某一个选项把这个index传过去,activeName等于那一个传过来的index(index是遍历出来的数据如:1,2,3,4,5),就显示该个active或者index==pid,pid默认为0,所以index==0,就是默认第一个选项被选中。

但是当我点击其它项的时候,要把那个pid改为false,只能把这个false赋值给uid,uid却不能在data里而声明,因为组件遍历v-for是时候就默认执行了selected()这个函数,所以只能把这个赋值给全局

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

我目前只能用这个方法解决这个问题,如果有更好的方法,希望可以共享一下

以上这篇解决vue-router 二级导航默认选中某一选项的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript入门学习书籍推荐
Jun 12 Javascript
利用jQuery插件扩展识别浏览器内核与外壳的类型和版本的实现代码
Oct 22 Javascript
Javascript实现真实字符串剩余字数提示的实例代码
Oct 22 Javascript
鼠标移到div,浮层显示明细,弹出层与div的上边距左边距重合(示例代码)
Dec 14 Javascript
jquery如何通过name名称获取当前name的value值
Dec 20 Javascript
SpringMVC restful 注解之@RequestBody进行json与object转换
Dec 10 Javascript
jQuery模仿单选按钮选中效果
Jun 24 Javascript
JavaScript中的ajax功能的概念和示例详解
Oct 17 Javascript
微信小程序如何获取群聊的openGid以及名称详解
Jul 17 Javascript
京东优选小程序的实现代码示例
Feb 25 Javascript
vue页面更新patch的实现示例
Mar 25 Javascript
jQuery实现日历效果
Sep 11 jQuery
微信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
微信小程序定义和调用全局变量globalData的实现
Nov 01 #Javascript
You might like
一些需要禁用的PHP危险函数(disable_functions)
2012/02/23 PHP
PHP笔记之:日期函数的使用介绍
2013/04/24 PHP
PHP中使用break跳出多重循环代码实例
2015/01/21 PHP
php实现遍历多维数组的方法
2015/11/25 PHP
ThinkPHP路由机制简介
2016/03/23 PHP
PHP实现登陆表单提交CSRF及验证码
2017/01/24 PHP
php实现数字补零的方法总结
2018/09/12 PHP
Laravel如何自定义command命令浅析
2019/03/23 PHP
js中如何把字符串转化为对象、数组示例代码
2013/07/17 Javascript
js添加table的行和列 具体实现方法
2013/07/22 Javascript
JS获得QQ号码的昵称,头像,生日的简单实例
2013/12/04 Javascript
页面get请求 中文参数方法乱码问题的快速解决方法
2016/05/31 Javascript
JSONP跨域请求实例详解
2016/07/04 Javascript
微信小程序 开发之顶部导航栏实例代码
2017/02/23 Javascript
javascript 判断一个对象为数组的方法
2017/05/03 Javascript
vue webuploader 文件上传组件开发
2017/09/23 Javascript
vue移动端项目缓存问题实践记录
2018/10/29 Javascript
原生JS实现手动轮播图效果实例代码
2018/11/22 Javascript
python 布尔操作实现代码
2013/03/23 Python
python实现绘制树枝简单示例
2014/07/24 Python
Python实现的生成格雷码功能示例
2018/01/24 Python
Python pyinotify日志监控系统处理日志的方法
2018/03/08 Python
Python numpy 点数组去重的实例
2018/04/18 Python
Django框架教程之中间件MiddleWare浅析
2019/12/29 Python
python使用HTMLTestRunner导出饼图分析报告的方法
2019/12/30 Python
Django之全局使用request.user.username的实例详解
2020/05/14 Python
基于python实现计算两组数据P值
2020/07/10 Python
JavaScript获取当前url根目录(路径)
2014/02/19 面试题
教师专业理论水平的自我评价分享
2013/11/09 职场文书
逃课检讨书怎么写
2015/01/01 职场文书
2015年信息宣传工作总结
2015/05/26 职场文书
实习证明模板
2015/06/16 职场文书
庆祝教师节主持词
2015/07/06 职场文书
优秀毕业生主要事迹材料
2015/11/04 职场文书
幼儿园教师教学反思
2016/03/02 职场文书
JavaScript实现一键复制内容剪贴板
2022/07/23 Javascript