import Vue from ‘vue‘;import $ from ‘webpack-zepto‘;import VueRouter from ‘vue-router‘;import filters from ‘./filters‘;import routes from ‘./routers‘;import Alert from ‘./libs/alert‘;import store from ‘./vuex/user‘;import FastClick from ‘fastclick‘;Vue.use(VueRouter);Vue.use(Alert);
routes ，Vue， VueRouter，store 都是跟vue vuex 和vuerouter 有关的 $是为了进行类似jquery的操作引进的库 FastClick解决移动端点击300ms延迟的问题 直接FastClick.attach(document.body) alert是当有error时电脑弹出的信息的设置
const router = new VueRouter({ ???mode: ‘history‘, ???routes})
router.beforeEach((to, from, next) => {
if (to.matched.some((record) => {
return record.meta.requiresAuth
}) {
if (store.state.userInfo.userId) {
next()
} else {
next({
?path: ‘/login‘,
query: {redirect: to.fullpath}
})
}
}else {
?next()
}
})router的初始化 mode为history 当路径改变时不会重新加载 router.beforeEach((to, from, next) {})实现的逻辑是 当record.meta.requiresAuth为true时 如果已经登陆 直接next()
如果没登陆 去登陆页面 为false时直接登陆
// 如果sessionStorage 储存了user 则通过vuex 赋值给userInfoif (window.sessionStorage.user) { ???store.dispatch(‘setUserInfo‘, JSON.parse(window.sessionStorage.user));}利用sessionStorage存储登陆信息 通过store执行setUserInfo action 分发用户信息
用vue写项目main.js 中的一些设置
原文地址：http://www.cnblogs.com/love-yangerlei/p/7900678.html