vue-router配置

110 阅读1分钟

1 安装vue-router

npm i vue-router@xxx版本号

2 创建router文件夹,在其下在创建index.js(导入时默认导入index)

 // 导入vueRouter和vue
 import VueRouter from 'vue-router';
 import Vue from 'vue';
 Vue.use(VueRouter)
 const routes = [
    {
        path: '/',
        redirect: '/about'
    },
    {
        path: '/about',
        name: 'About',
        component: () => import('../views/About.vue')
    }
]
const router = new VueRouter({
    routes
})

export default router

3 在main.js中声明配置router

import Vue from 'vue'
import App from './App.vue'
import router from './router';

Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App),
}).$mount('#app')

4 创建路由组件文件夹 views 或者 pages