1

我试图在 Vuejs 2 应用程序的引导文件中导入商店，在商店内部，我使用的是使用 VueResource 的数据提供程序...这样做，我必须在实际调用之前导入使用 VueResource 的商店Vue.use(VueResource) 我的代码是如下所示：

import Vue from 'vue'
import VueRouter from 'vue-router'
import VueResource from 'vue-resource'
import Vuex from 'vuex'
import store from './store/index'

Vue.use(Vuex)
Vue.use(VueResource)
Vue.use(VueRouter)

//let store = require('./store/index');


const router = new VueRouter({
  mode: 'history',
  routes: [{
    'name': 'home',
    path: '/',
    component: require('./components/Home.vue')
  }, {
    'name': 'profile',
    path: '/profile',
    component: require('./components/Profile.vue')
  }, {
    'name': 'login',
    path: '/login',
    component: require('./components/Login.vue')
  }, {
    'name': 'new',
    path: '/new',
    component: require('./components/New.vue')
  }, {
    'name': 'signup',
    path: '/signup',
    component: require('./components/Signup.vue')
  }, {
    'name': 'logout',
    path: '/logout'
  }, {
    'name': 'article',
    path: '/article/:id',
    component: require('./components/Article.vue')
  }]
})

router.beforeEach((to, from, next) => {
  console.log(to, from)
  if (!localStorage.getItem('user') && (to.name === 'profile' || to.name === 'home' || to.name === 'article' || to.name === 'new')) {
    console.log('login first!')
    next('/login')
  } else if (to.name === 'logout') {
    console.log('logout')
    store.dispatch('updateProfile', null)
    localStorage.removeItem('user')
    next('/login')
  } else {
    next()
  }
})

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  template: '<App/>',
  render: h => h(require('./App'))
})
4

0 回答 0