Используйте одну и ту же страницу для нескольких маршрутов

Question

Я пытаюсь выяснить, как использовать одну и ту же страницу для нескольких маршрутов в Nuxt. js с модулем i18n.

В основном я хочу, чтобы этот маршрут: /product-category/:slug/in/:material использовал ту же страницу, что и /product-category/:slug

Пока что я пробовал ниже, добавив его в nuxt.config. js - но это не работает. Он просто показывает файл _slug/_material/index.vue.

router: {
    extendRoutes (routes, resolve) {
        routes.push({
            path: '/product-category/:slug/in/:material',
            component: resolve(__dirname, 'pages/product-category/_slug/index.vue')
        })
    }
},

Может быть, потому что у меня есть модуль i18n, может быть, потому что я делаю что-то не так.

Это моя структура папок:

Если я проверяю свой маршрутизатор. js файл, я вижу путь, показанный дважды:

Answer 1

Это был мой обходной путь, просто я sh нашел более простой способ. Плюс он все еще работает, если вы используете nuxt i18n.

nuxt.config. js

router: {
    extendRoutes (routes, resolve) {
        const routesToAdd = [
            { // add your routes here
                name: 'product-category-slug-material',
                path: '/product-category/:slug/in/:material',
                component: resolve(__dirname, 'pages/product-category/_slug/index.vue'), // which component should it resolve to?
                chunkName: 'pages/product-category/_slug/_material/index' // this part is important if you want i18n to work
            }
        ];

        const existingRoutesToRemove = routesToAdd.map(route => route.name);

        const generateRoutes = routes.filter((route) => {
            return !existingRoutesToRemove.includes(route.name);
        });

        routesToAdd.forEach(({ name, path, component, chunkName }) => {
            generateRoutes.push({
                name,
                path,
                component,
                chunkName
            });
        });

        routes.splice(0, routes.length, ...generateRoutes); // set new array
    }
},