首页 > 其他分享 >通过路由对象进行判断当前css样式的显示与隐藏

通过路由对象进行判断当前css样式的显示与隐藏

时间:2022-11-16 01:11:17浏览次数:63  
标签:样式 route current 对象 css path 路由

可以解决ul>li 进行路由跳转而css样式的激活模式无需使用三元或函数判断就可以产生效果

 

示例

:class="{ current: $route.path == item.url }

解释:

  1. current 即为选定激活的 css 格式名称

  2. $route.path 当前路由对象的路径

  3. 当路由对象的路径等于判断的 item.url 时 current就会变为 true 模式

 

利用到的即为 $route.path 获取当前路由对象

标签:样式,route,current,对象,css,path,路由
From: https://www.cnblogs.com/Dollom/p/16894572.html

相关文章

  • Vue3在Vite中配置scss并使用
     提出问题单个文件引入时,需要在每个 stylelang="scss"scoped标签下这样引入,每次都要手动引入非常麻烦,因此就想做全局配置@import"@/assets/scss/global.scss"......
  • day 26-css初步学习
    css两种改变html格式的方法:内部style:在title下添加<style>写选择器的声明 1<!--<style>-->2<!--h1{-->3<!--color:aqua;-->......
  • 后端程序员必会的前端知识-01:html、css
    第一章.HTML与CSSHTML是什么:即HyperTextMarkuplanguage超文本标记语言,咱们熟知的网页就是用它编写的,HTML的作用是定义网页的内容和结构。HyperText是指用超链......
  • HCIP-ICT实战进阶05-路由策略与策略路由
    HCIP-ICT实战进阶05-路由策略与策略路由0前言什么是路由策略?基于报文的目的IP地址进行路由表查找,之后转发数据;针对控制平面,为路由协议和路由表服务,针对路由......
  • ASP.NET 路由
    ASP.NET路由使您可以使用不必映射到网站中特定文件的URL。由于URL不必映射到文件,所以可以在Web应用程序中使用URL,这些URL是描述性的用户操作,因......
  • OpenSergo 流量路由:从场景到标准化的探索
    作者:十眠流量路由,顾名思义就是将具有某些属性特征的流量,路由到指定的目标。流量路由是流量治理中重要的一环,多个路由如同流水线一样,形成一条路由链,从所有的地址表中筛选出......
  • CSS布局2
    结构伪类选择器          ◆伪元素       ◆浮动               ◆清除浮动 ......
  • Vue路由的使用(页面跳转)
    路由不是内部功能所以需要先安装:一定要安装到相关项目中哦cnpminstall--savevue-router 需创建的文件夹及文件:......
  • html5 css timeline horizontal
     <!doctypehtml><html><head><metacharset="utf-8"> <metaname="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1......
  • CSS左侧固定,右侧自适应方案
    1.浮动将左边固定区域设置浮动,右边margin设置为左边固定div的宽度html代码 <div class="left"></div> <div class="right"></div>css代码.left{width:200px;......