<div id="app">
  <nav class="nav">
    <a v-for="link in links" href="#" class="nav-link" v-bind:class="{ active: link.isActive, 'home': link.isHome }">{{ link.title }}</a>
  </nav>
</div>

.nav {
  display: flex;
  padding: 15px;
  background-color: #eaeaea;
  font-family: sans-serif;
}

.nav-link {
  margin: 5px 10px;
  color: #666;
  text-decoration: none;
}

.active {
  border-bottom: 2px solid #000;
  color: #000;
}

const app = new Vue({
  el: '#app',
  data: {
    links: [
      { title: 'Home', isActive: false, isHome: true},
      { title: 'About', isActive: true, isHome: false}
    ]
  }
})