先来说说功能然后在说路由的配置，先大概清楚了项目的流程，然后在配置路由会让你后面的工作更加顺利，头脑更加清晰！
比如说我的项目中一般都是需要登录的，最关键的是用户不操作页面一定时间后系统会默认用户退出，这时候在获取用户信息就是未登录的，还有就是有一些公共的地方，只是某一部分需要切换。
来上代码： （说明在代码下面）
export default new Router({
routes: [
{
path:'/', //load
name:"loadding",
component: resolve => require(['../components/page/loadding.vue'], resolve),
},
{
path: '/', //这里是主页面，公共的和切换的都放到这个页面，
component: resolve => require(['../components/common/Home.vue'], resolve),
children:[
{
path:'/login', //登录
name:"login",
component: resolve => require(['../components/page/Login.vue'], resolve)
},
{
path:'/nopersition', //无权限页面
name:"nopersition",
component: resolve => require(['../components/page/nopersition.vue'], resolve)
},
{
path:'/index', //首页
name:'index',
component: resolve => require(['../components/Home/index.vue'], resolve),
},
{
path:'/step1', //步骤1
name:"step1",
component: resolve => require(['../components/Home/step/step1.vue'], resolve),
},
{
path:'/step2', //步骤2
name:"step2",
component: resolve => require(['../components/Home/step/step2.vue'], resolve),
},
{
path:'/step3', //步骤3
name:"step3",
component: resolve => require(['../components/Home/step/step3.vue'], resolve),
},
{
path:'/organizationDetails', //详情页面
name:'organizationDetails',
component: resolve => require(['../components/Home/organizationMore/organizationDetails.vue'], resolve)
}
]
}
]
})那么为什么要这样写呢？有一个方便的地方，那就是因为每次跳转页面都要知道用户是否还是登陆状态，如果不是就要提示他去登陆或者跳到登陆页面去。这样写的话只要在index.vue首页上面监听路由来判断就好了。那么怎么监听路由，怎么写呢？会的小伙伴儿就不用看下一个了，不会的请看下一个！