router-link高亮问题

Question

老师，我没有用style那个组件 直接用css写的样式 ，现在有一个问题，进去页面 第一个router-link 推荐那个内容始终高亮，不管切换到哪个路由一直高亮，但是其他三个理由切换正常，不会一直高亮，这个怎么回事，代码一样，就是所有的CSS都是现在每个VUE组件里的

<style scoped>

    .tab{

    display: flex;

    height: 44px;

    line-height: 44px;

    font-size: 14px;

    }

    

    .tab-item{

      flex: 1;

      text-align: center;

    }

      

    .tab-link{

      padding-bottom: 5px;

color:#ccc;

    }

    .router-link-active span{

       color: yellow;

       border-bottom: 2px solid #fff;

    }

          

</style>

Answer 1

提问者 qq_帆叔_0 2018-05-18 19:18:15

import Vue from 'vue'

import Router from 'vue-router'

import Recommend from '../components/head/recommend'

import Rank from '../components/head/rank'

import Search from '../components/head/search'

import Singer from '../components/head/singer'

Vue.use(Router)

export default new Router({

  routes: [

  {

  path:'/',

  redirect:'/recommend'

  },

    {

      path: '/recommend',

      component: Recommend,

    },

    {

      path: '/singer',

      component: Singer

    },

    {

      path: '/rank',

      component: Rank

    },

    {

      path: '/search',

      component: Search

    },

  ]

}

这是我的路由配置

Answer 2

ustbhuangyi 2018-05-18 15:54:27

你路由的配置是怎么写的

• 提问者 qq_帆叔_0 #1

  import Vue from 'vue'
  import Router from 'vue-router'
  import Recommend from '../components/head/recommend'
  import Rank from '../components/head/rank'
  import Search from '../components/head/search'
  import Singer from '../components/head/singer'
  
  
  Vue.use(Router)
  
  export default new Router({
    routes: [
    	{
    		path:'/',
    		redirect:'/recommend'
    	},
      {
        path: '/recommend',
        component: Recommend,
      },
      {
        path: '/singer',
        component: Singer
      },
      {
        path: '/rank',
        component: Rank
      },
      {
        path: '/search',
        component: Search
      },
    ]
  }
  这是我的路由配置

• 提问者 qq_帆叔_0 #2

  老师 帮忙看一下呦，路由的配置也发出来了

• ustbhuangyi 回复 提问者 qq_帆叔_0 #3

  你把代码放到 GitHub 上吧，这样也看不出来问题