如何使用nuxt-link和i8n导航子页面？

Question

显然，我可以像这样调用简单的页面：<nuxt-link :to="localePath('about')"> = http://127.0.0.1:3000/about-us

但是调用<nuxt-link :to="localePath('addItem/food')">会让我返回到根目录。当我在addItem页面上时，<nuxt-link :to="localePath('food')">也是如此。(http://127.0.0.1:3000/)

如果我简单地放入<nuxt-link :to="localePath('addItem')">，我将被带到addItem/index，但这是唯一有效的方法。

如何正确导航到addItem/食品？

页面：

pages: {
        'addItem/index': {
          en: '/add-item',
          fr: '/ajout-item',
        },
        'addItem/food': {
          en: '/add-item/food',
          fr: '/ajout-item/alimentation',
        },
        'addItem/pharma': {
          en: '/add-item/pharmaceuticals',
          fr: '/ajout-item/medicaments',
        },
        about: {
          en: '/about-us', // -> accessible at /about-us (no prefix since it's the default locale)
          fr: '/a-propos', // -> accessible at /fr/a-propos
        }
      },

如果我直接输入url，它就能工作。

如何让nuxt- link /localePath正确打印链接？

Answer 1

我也有同样的问题。在对".nuxt“文件夹中生成的router.js进行了一些研究和更深入的查看之后，您可以在函数"createRouter()”中看到生成的路由。在这里您可以看到，每个路由的名称都包含路径。但在本例中，路径仅由连字符链接。

对于您的示例，这应该按如下方式工作：<nuxt-link :to="localePath('addItem-food')">