我可以使用 Vuejs 路由器路由数组来动态创建导航吗？

Question

这是我设置 vuejs 路由并传递到路由器的代码：

export const routesArray = {
  routes: [
    {
      path: '/',
      name: 'Add Stash',
      component: Form
    },
    {
      path: '/log',
      name: 'Stash Log',
      component: Stitch
    },
    {
      path: '/user/register',
      name: 'Register',
      component: Register
    },
    {
      path: '/user/login',
      name: 'Log in',
      component: Login
    }
  ]
}
export default new Router(routesArray)

我正在将此代码导入 Vue 组件并使用它循环遍历数组并动态输出导航，如下所示：

<ul class="nav">
  <li v-for="item in routes">
      <a :href="item.path"> {{item.name}}</a>
  </li>

此显示效果如梦如幻，但当我单击导航项时，它会损坏 link： http://localhost:8080/log#/

而不是这个： http://localhost:8080/#/log

我不确定如何绕过该哈希？有什么想法吗？

Answer 1

使用 router-link 代替 a。

<li v-for="item in routes">
    <router-link :to="item.path">{{item.name}}</router-link>
</li>

我可以使用 Vuejs 路由器路由数组来动态创建导航吗？

Can I use Vuejs router routes array to dynamically create a nav?

javascript

router

vue.js