vue 导航内容设置选中状态样式

如图所示，我们一般需要切换的时候选中导航给个active样式，而router-link 标签在选中的时候会自动给整个标签添加一个 router-link-active的class 可给router-link 标签里面的span、i标签如下设置，非常简单，下面是stylus的写法，不需要的话也可以写成平时的css写法.router-link-activespan...

Web攻城狮-前端

6468人浏览 · 2018-06-07 14:57:23

Web攻城狮-前端 · 2018-06-07 14:57:23 发布

如图所示，我们一般需要切换的时候选中导航给个active样式，

而router-link 标签 在选中的时候  会自动给整个标签添加一个 router-link-active的class

可给router-link 标签里面的span、i标签如下设置，非常简单，下面是stylus的写法，不需要的话也可以写成平时的css写法

 
  .router-link-active 
 
  span 
 
  i 
 
  color: 
  red

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^