vue.js - vue2.0 router

问题描述

问 题

在github下下载了一个2.0的demo，但是下面有些不太明白
我把注释写在下面，望大神解答下

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);

$.ajaxSettings.crossDomain = true;

Object.keys(filters).forEach(k => Vue.filter(k, filters[k]));

const router = new VueRouter({
    mode: 'history',
    routes
});
FastClick.attach(document.body);


if (sessionStorage.user) {
    //1、vue2.0不是废弃了dispatch了吗？为什么这里还能用
    store.dispatch('setUserInfo', JSON.parse(sessionStorage.user));
}

router.beforeEach((to, from, next) => {

    $('html, body, #page').removeClass('scroll-hide');
    //2、这个条件句里的条件是什么意思,
    //我看api这个to没有写明它的方法或属性之性的东西有这个matched.some?
    if (to.matched.some(record => record.meta.requiresAuth)) {
        if (store.state.userInfo.userId) {
            next();
        } else {
            next({
                path: '/login',
                query: { redirect: to.fullPath }
            });
        }
    } else {
        next();
    }
});

new Vue({
    router,
    store
}).$mount('#app');

解决方案

dispatch 是vuex中 store.dispatch
https://vuex.vuejs.org/zh-cn/...

to.matched是个数组 some是数组的方法
https://router.vuejs.org/zh-c...
https://developer.mozilla.org...

这篇关于vue.js - vue2.0 router的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！