nested routes,router-link uses: to={name} missing class name

[rockPrince]

Version

3.0.3

Reproduction link

https://1801v9yoml.codesandbox.io/demo1/demo1-1

Steps to reproduce

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/',
      redirect: 'demo1',
      component: Layout,
      children: [{
        path: 'demo1',
        name: 'demo1',
        redirect: {
          name: 'demo1-1'
        },
        component: demo1,
        children: [{
          path: 'demo1-1',
          name: 'demo1-1',
          component: demo1_1,
        }, {
          path: 'demo1-2',
          name: 'demo1-2',
          component: demo1_2,
        }, {
          path: 'demo1-3',
          name: 'demo1-3',
          component: demo1_3,
        }]
      }]
    }
  ]
})

<template>
  <div>
    <router-link :to="{name:'demo1'}">demo1</router-link>
    <router-link to="/demo1">demo1</router-link>
    <router-view></router-view>
  </div>
</template>
<script>
export default {
  name: 'layout'
}
</style>

The first route-link is missing the class name when the route is '/demo1/demo1-2' or '/demo1/demo1-2'
The second-link route is ok

What is expected?

The first route-link has 'router-link-active' class name

What is actually happening?

The first route-link missing 'router-link-active' class name

[posva]

I cannot see the code but looking at your routes config: a redirect with a component doesn't makes sense because the route is never displayed. So the first part should be:

{
      path: '/',
      component: Layout,
      children: [{
        path: '',
        name: 'demo1',
        redirect: {
          name: 'demo1-1'
        },

Otherwise this is probably a duplicate of #2724