第一步,优化
import Vue from 'vue'
import VueRouter from 'vue-router'
import Login from '@/views/Login'
import Layout from '@/views/Layout'
import Home from '@/views/Layout/Home'
const Search = () => import( '@/views/Search')
const SearchResultList = () => import( '@/views/Search/ResultList')
Vue.use(VueRouter)
const routes = [
{
path: '/',
redirect: '/layout'
}, {
path: '/login',
component: Login
}, {
path: '/layout',
component: Layout,
redirect: '/layout/home',
children: [
{
path: 'home',
component: Home,
meta: {
scrollY: 0
}
}, {
path: 'user',
component: User
}
]
}, {
path: '/search',
component: Search
}, {
path: '/search/:keyword',
name: 'resultlist',
component: SearchResultList
}
]
const router = new VueRouter({
routes
})
export default router
官网
https://router.vuejs.org/zh/guide/advanced/lazy-loading.html#%E6%8A%8A%E7%BB%84%E4%BB%B6%E6%8C%89%E7%BB%84%E5%88%86%E5%9D%97
第二步检查是否成功
![在这里插入图片描述](https://img-blog.csdnimg.cn/62955e4ca21e42899d7527cd1cae9466.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5Y-k6L-q57qi5bCY,size_20,color_FFFFFF,t_70,g_se,x_16#pic_center)
|