我可以在 vue 路由器中使用 & 号而不是前斜线吗？

Question

我正在制作一个 VueJS 表格组件作为 php Web 应用程序的一部分。该应用程序使用“/”来更改目录，使用“&”来导航 Web 应用程序。我是否有可能在 vue 路由器上使用 & 符号，或者我必须想出一个自定义的导航解决方案？有什么推荐吗？

const routes = [
    {
        path: '&',
        component: Table
    },
    {
        path: '&create',
        component: Create
    },
    {
        path: '&single&:id',
        component: Single
    },
    {
        path: '&edit&:id',
        component: Edit
    }
]

Answer 1

在这种情况下这是不可能的。使用vue-router 时，所有父路由都需要一个正斜杠。这不是子路由的情况，正如您在文档中的这个示例中看到的那样：

const router = new VueRouter({
  routes: [
    {
      path: '/user',
      component: User,
      children: [
        {
          path: 'profile',
          component: UserProfile
        },
        {
          path: 'posts',
          component: UserPosts
        }
      ]
    }
  ]
})

尽管如此，即使您只使用一个父路由而只使用子路由，您仍然需要为父路由添加正斜杠。也许您找到了解决这种情况的方法并提供如下路线：

const routes = [
    {
        path: '/table',
        component: Table,
        children: [
            {
                path: 'create',
                component: Create
            },
            {
                path: 'single',
                component: SingleContainer, // Wrapper
                children: [
                    {
                        path: ':id',
                        component: Single
                    }
                ]
            },
            {
                path: 'edit',
                component: EditContainer, // Wrapper
                children: [
                    {
                        path: ':id',
                        component: Edit
                    }
                ]
            }
        ]
    }
]

如果您也将它们命名为name: 'create'，则可以在没有前斜杠的情况下调用它们，例如：

<router-link :to="{ name: 'create'}">Create</router-link>

但正如我所说，您仍然需要在您的router.js 中提供至少一个带有正斜杠的父路由。

如果可以在 url 请求服务器端替换 & 符号，我做了一些研究。但与号是保留字符，您可以在此处阅读：Reserved characters