Home > Software engineering >  Defining routes in a separate file and using them inside index.js
Defining routes in a separate file and using them inside index.js

Time:12-20

I have this routes inside my index.js

import {
    createRouter,
    createWebHistory
}
from '@ionic/vue-router';
import {
    RouteRecordRaw
}
from 'vue-router';

const routes = [{
        path: '',
        redirect: '/tabs'
    }, {
        path: '/tabs',
        component: () => import('../views/tabs/TabRoot.vue'),
        children: [{
                path: '',
                redirect: '/tabs/home'
            }, {
                path: '/tabs/home',
                component: () => import('../views/tabs/Home.vue')
            }, 
        ]
    },


   //Sell
   
    {
        path: '/sell',
        component: () => import('../views/pages/sell/Sell.vue')
    },


    //Categories
    
    {
        path: '/trending',
        component: () => import('../views/pages/Trending.vue')
    }
]

const router = createRouter({
    history: createWebHistory(process.env.BASE_URL),
    routes
})

export default router

and i would like to define the follwoing routes isnide others.js file and have this inside

{
    path: '/crud_ui_landing_vehicles',
    component: () => import('../views/pages/sell/categories/Vehicles.vue')
},

{
    path: '/crud_ui_landing_properties',
    component: () => import('../views/pages/sell/categories/Properties.vue')
},

The imported routes should be used inside const routes array object. How can i define and import the routes file?

CodePudding user response:

Using the spread operator

// others.js
export const others = [...]
import { others } from './others.js'
const routes = [
  ...others,
             
  • Related