add router to vue
vue add router # Vue CLI
create web router in vue
import { createWebHistory, createRouter } from "vue-router";
import Home from "@/views/Home.vue";
import About from "@/views/About.vue";
const routes = [
{
path: "/",
name: "Home",
component: Home,
},
{
path: "/about",
name: "About",
component: About,
},
];
const router = createRouter({
history: createWebHistory(),
routes,
});
export default router;
router configuration vue
npm install --save vue-router
//after installing vue-router in the project
//go inside main.js in your project and add
//(just after Vue.config.productionTip=false):
Vue.use(VueRouter):
const routes=[
{path: '/home', component: [componentName]},
{path: '/features', component: [componentName2]},
.
.
.
];
//you can add as many routes as you need
//also add:
const router=new VueRouter({
routes,
mode: 'history'
});
//to make the router accesible for all the project you need to add it inside the new Vue:
new Vue({
router, <----
.
.
}).$mount('#app')
//to make different pages acoording to the route selected, add (inside app.vue):
<template>
<div id="app">
<Navbar></Navbar>
<router-view> </router-view> <----------
<Footer></Footer>
</div>
</template>
Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us