Shopware 6插件Vue Router默认ID路由配置问题求助

开发者阿泽

2026-7-22

问题解决：Shopware 6插件Vue Router默认ID路由配置错误

错误原因分析

第一种写法中，path: 'plugin.index.list/1'错误地将路由名称与参数拼接，Vue Router无法识别这种格式，导致路由不存在的报错。
第二种写法里，params: 'id: 1'使用了字符串格式，而正确的参数传递需要对象格式，Shopware导航系统无法解析字符串类型的params。

解决方案

方案一：正确配置导航的参数传递

直接在导航项中通过params对象传递默认ID，确保path为正确的路由名称：

navigation: [{
    id: 'plugin-list',
    label: 'Plugin',
    path: 'plugin.index.list',
    params: { id: 1 }, // 改为对象格式传递参数
    icon: 'default-shopping-paper-bag-product',
    parent: 'sw-catalogue',
    position: 100
}]

Shopware的导航系统会自动将params中的参数拼接到路由路径，生成正确的URL（如/list/1）。

方案二：添加默认重定向路由（兼容无参数访问）

如果需要支持用户直接访问无参数的路由时自动跳转到默认ID页面，可以新增一个重定向路由：

routes: {
    list: {
        path: 'list/:id',
        component: 'plugin-list'
    },
    // 新增默认路由，重定向到ID=1的列表页
    listDefault: {
        path: 'list',
        redirect: { name: 'plugin.index.list', params: { id: 1 } }
    }
},

navigation: [{
    id: 'plugin-list',
    label: 'Plugin',
    path: 'plugin.index.listDefault',
    icon: 'default-shopping-paper-bag-product',
    parent: 'sw-catalogue',
    position: 100
}]

这种方式既满足导航默认跳转带ID的页面，也兼容用户手动访问/list时的重定向需求。