1.先去iView官网选择合适的模板
http://v1.iviewui.com/components/layout
2.复制其代码
3.我们先在src文件中新建一个layout文件夹,里面新建admin.vue文件
里面粘贴我们复制过来的代码
4.找到src\router\index.js文件中添加模板代码
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
//引入我们自己的模板
import Admin from '../layout/admin.vue'
Vue.use(VueRouter)
const routes = [
{
path: '/',
name: 'Admin',
//使用模板
// component: Admin,
// 或者
component: () => import(/* webpackChunkName: "about" */ '../layout/admin.vue'),
children:[
// {
// path: '/',
// name: 'Admin',
// // component: Admin,
// },
// {
// path: '/',
// name: 'Admin',
// // component: Admin,
// }
]
},
// {
// path: '/about',
// name: 'About',
// // route level code-splitting
// // this generates a separate chunk (about.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
// }
]
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
export default router