Gatsby 盖茨比多参数动态路由

我正试图让盖茨比使用具有多个url参数的动态路由。 我希望能够导航到：

…/items/124/MyItemsTitle

在我的gatsby-node.js中，我有以下代码：

exports.onCreatePage = async ({ page, actions }) => {
    const { createPage } = actions;
    // page.matchPath is a special key that's used for matching pages
    // only on the client.
    if (page.path.match(/^\/user/)) {
        page.matchPath = "/user/*";
        // Update the page.
        createPage(page);
    }

    if (page.path.match(/^\/items\/([0-9]+)\/\w+$/)) {
        page.matchPath = "/items/:itemId/:itemTitle";
        // Update the page.
        createPage(page);
    }
};

路由器的组件如下所示：

items.js

   <Router>
            <ItemDetail path="/items/:itemId/:itemTitle" />
        </Router>

但它只是呈现给404

我已经尝试了所有可用的正则表达式 多次阅读文档，但最终url中总是只有一个变量。 然后它就起作用了。 一旦我使用多个参数，它就会中断

谢谢

找到了问题：

将此添加到gatsby-node.js就足够了

if (page.path.match(/^\/items/)) {
    page.matchPath = "/items/*";
    // Update the page.
    createPage(page);
}

路径的其余部分由路由器处理。 因此，您需要的参数越多，只需将它们添加到路由器中组件的路径中即可

 <Router>
        <Items path="/items/:itemId" />
        <ItemDetail path="/items/:itemId/:itemTitle" />
 </Router>

这对我很有用