Возможно ли добавить .active к маркеру с помощью router-link?

Question

[Максим]

.navigation
    ul
      li
        router-link(:to="{ name: 'tasks'} ") Tasks
      li
        router-link(:to="{ name: 'kanban'}") Kanban
      li
        router-link(:to="{ name: 'activity'}") Activity
      li
        router-link(:to="{ name: 'calendar'}") Calendar
      li
        router-link(:to="{ name: 'files'}") Files
  .marker
    .selecttasks
      span
    .selectkanban
      span
    .selectactivity
      span.third-marker( )
    .selectcalendar
      span.fourth-marker( )
    .selectfiles
      span

Answer 1

[0xD34F]

data: () => ({
  links: [ 'tasks', 'kanban', 'activity', 'calendar', 'files' ],
}),

ul
  li(v-for="n in links")
    router-link(:to="{ name: n }") {{ n }}
.marker
  div(v-for="n in links" :class="[ `select${n}`, $route.name === n ? 'active' : '' ]")
    span

https://jsfiddle.net/rmnLokj3/

Непонятно только зачем оно надо - убрали бы эти "маркеры", и стилизовали сами ссылки, там вручную никаких классов добавлять не надо, уже всё есть.

https://jsfiddle.net/rmnLokj3/1/

Answer 2

[Aetae]

Может стоит почитать документацию, в которой даже есть именно такой пример?