Vue router 中 router-link 的 to 怎么绑定对象数组中的属性?

Question

<template lang="pug">
  .header
    router-link(to="/")
      img.logo(src="../assets/logo.png")
    nav.nav-bar
      ul
        li(v-for="nav in navBars")
          router-link(to="{{ nav.navLink }}") {{ nav.navName }}
</template>

<script>
export default {
  name: 'Index',
  data() {
    return {
      navBars: [
        { navName: '网站首页', navLink: '/' },
        { navName: '关于我们', navLink: '/' },
        { navName: '公司新闻', navLink: '/' },
        { navName: '服务案例', navLink: '/' },
        { navName: '招贤纳士', navLink: '/' },
      ],
    };
  },
};
</script>

router-link(to="{{ nav.navLink }}") {{ nav.navName }} 这里到底该怎么写才可以呢?

Answer 1

v-bind:to="nav.navLink"

Answer 2

<router-link tag="a" :to="dest"></router-link>
dest = { name: 'user'}