Javascript 将自定义数据传递到vue路由器中的“$router.push（）”

是否有方法将未在路由路径中注册为param或query的附加数据传递到

$router.push（）

。这将允许我在下一页上识别出它是通过编程导航访问的，因为无法通过URL传递它。比如：

this.$router.push({
   path: '/next-page', 
   params: {...}, 
   query: {...}, 
   moreData: {foo: 1}
})

然后在下一页中：

this.$route.moreData.foo // 1

---

目前我正在使用

$store

来处理

更多数据

我找到了解决方案。表中有一个注释，说明：

注意：

如果提供了路径

，则忽略参数。。。相反，您需要提供

名称

因此，如果我们使用路线的

名称进行导航，我们可以将自定义数据传递给
参数，如下所示：

$router.push({name: 'next-page', params: {foo: 1}})

// in /next-page
$route.params.foo // 1

在我的例子中，我使用了名称redirect，但无法接收自定义参数，因为目标路由具有路径重定向-在本例中，提供的参数丢失

因此，需要将“路径重定向”更改为“命名重定向”，但由于“路径重定向”在路径中包含额外的数据，我现在需要使用参数通过“名称重定向”传递该数据

因此，我最终使用了一个助手“redirectByName”函数，该函数在本例中保留了参数：

redirectByName.js

//redirects by preserving params
export default (name, params = {}) => {
    return (route) => ({
        ...route,
        name,
        params: {
            ...route.params,
            ...params
        }
    })
}

下面是一个如何使用它的示例：

myRoutes.js

    import redirectByName from "./redirectByName";
    ...
    export default return [
        {
            path:'some/path',
            name: 'targetRouteName',
            redirect:redirectByName('redirectRouteName', {tab: 'general'}), //optional additional parameters for redirection
        }, 
        {
            path:'some/path/:tab', 
            name: 'redirectRouteName'
        }]

redirectByName
基本上采用目标
route
对象来保留所有传递的数据，用提供的参数覆盖其
name
参数，并合并参数。然后，它将最终的路由对象传递回以完成重定向。
您可以尝试
meta
而不是
moreData
？我尝试了
.push（{meta:{foo:1}}}）
但是在转换之后，
$route.meta
是空对象（
{}
），为什么不能通过查询来实现它？因为参数是private@slim,这个路由名称的url是什么？数据是通过URL传递的吗？@AkshayDeshmukh否，它不是通过URL传递的，但可以通过
$route.params
访问。url是与具有该名称的路由对应的url。只有一条路由具有该名称，因为它被视为唯一标识符。当然，如果我导航到一个路径
{name:'users id'，params:{id:1}}
，它有一个
路径='/users/:id'
，该id也会出现在url中。哎哟，他们的错误是多么令人沮丧啊，params只与命名路径一起工作，这让我花了很长时间才弄明白，谢谢@凯文：这不是真正的虫子。他们只是使用单一的真理来源。如果你通过路径，他们必须从那里提取参数。否则，它们会查找
params
对象：），不过，它们可能应该始终尝试在
path
上以更高的优先级合并这两个对象，以防名称冲突。