适用场景:如果 src/views 文件夹下都是路由页,可在 src/router/index.js 中设置自动获取。
src/router/index.js
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
// 遍历 views 文件夹下的全部 vue 文件
const requireViews = require.context('../views', true, /\w+\.vue$/);
// 获取所有组件对象,遍历设置
const routes = requireViews.keys().map((viewPath, index) => {
let viewName = viewPath.split('.vue')[0].substr(2);
return {
path: viewName === 'index' ? '/' : `/${viewName}`,
name: viewName,
component: () => import(`../views/${viewName}.vue`)
}
});
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
export default router