Vue回炉重造之router路由(更新中)
安装vue-router
npm i vue-router -S
配置
1、创建文件夹与文件
创建一个router文件夹,在文件夹中创建两个文件,分别是router.js和routes.js文件。
2、编辑文件
router.js(路由配置文件)
import Router from 'vue-router'
import routes from './routes'
export default ()=> {
return new Router({
routes,
mode:'history',
fallback:true //对于浏览器不支持history模式的,会自动转成hash模式
})
}
routes.js(路由页面文件)
import Index from '../views/Index.vue'
import Login from '../views/Login.vue'
export default [
{
path: '/',
component: Index
},
{
path: '/login',
component: Login
}
]
main.js(Vue入口文件)
import Vue from 'vue'
import App from './App.vue'
import Router from 'vue-router'
import createRouter from './router/router'
Vue.use(Router)
Vue.config.productionTip = false
const router = createRouter()
new Vue({
router,
render: h => h(App),
}).$mount('#app')
作者:Vam的金豆之路
主要领域:前端开发
我的微信:maomin9761
微信公众号:前端历劫之路