Vue Router能否使用&符号替代正斜杠作为路径标识？

核心结论 #

你可以直接在Vue Router中使用&符号定义路由路径，不需要额外开发完整的自定义导航方案，只需要根据你的路由模式做少量适配即可。

注意事项 #

&在URL标准中是默认的查询参数分隔符，使用时需要注意两种路由模式的差异：

• 如果你使用hash模式的Vue Router，hash部分的内容不会被发送到服务端，&不会被误解析为查询参数分隔符，匹配稳定性最高
• 如果你使用history模式，必须要服务端配合配置重写规则，确保所有带&的路径全部指向Vue应用的入口文件，同时PHP侧不要将&后的内容识别为查询参数

实现优化建议 #

低成本适配方案（直接沿用现有路由配置） #

给你的路由加上name属性，跳转时统一用name+params的方式，避免手动拼接路径出错：

const routes = [
    {
        name: 'table',
        path: '&',
        component: Table
    },
    {
        name: 'create',
        path: '&create',
        component: Create
    },
    {
        name: 'single',
        path: '&single&:id',
        component: Single
    },
    {
        name: 'edit',
        path: '&edit&:id',
        component: Edit
    }
]
// 跳转示例
router.push({ name: 'edit', params: { id: 123 } })

高兼容性方案（自定义路径转换） #

如果担心&和URL标准的冲突问题，可以不用修改地址栏的展示规则，用Vue Router的钩子做一层内部转换：

• 路由配置正常使用/作为路径分隔符，比如/table、/edit/:id
• 通过全局前置守卫和stringifyQuery配置，做路径的双向映射：用户看到的地址栏是&开头的规则，路由内部自动转成标准/开头的路径匹配
• 这种方案完全符合URL规范，不需要服务端做额外配置，后续扩展路由规则也更灵活

内容的提问来源于stack exchange，提问作者jfkeci