'Nuxt Router path encoded the "/" to "%2F"

I fetch a page structure via my API endpoint:

"uuid": "a0908158-796f-4de6-ac06-6cdf234db80b",
"name": "Category 2",
"parentCategoryUuid": "d0cfe404-7486-4a57-beeb-53569b40bb4b",
"slug": "category2",
"path": "category1/category2",

Now I use "path" as the path in NuxtLink params as below.

<NuxtLink
:to="{
name: 'pages',
params: { path: item.path },
}"
>
{{ item.name }}
</NuxtLink>

This also works except for the fact that "/" is always encoded to "%2F".

The URL then looks like this: "/category1%2Fcategory2". But of course it should look like this: "/category1/category2"

My config looks like this:

router: {
    extendRoutes(routes, resolve) {
      return [
        {
          name: 'pages',
          path: '/:path*',
          component: resolve(__dirname, 'pages/Page.vue')
        },
      ]
    }
  }

How can I prevent the "path" from being encoded?

I am using Nuxt 2.15.7



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source