2017-03-24 10 views
0

ランダムコンポーネント内のvuexストアにアクセスしようとすると、undefinedが返されます。しかし、私は店を私のVueオブジェクトに注入しました。誰もこれを解決する方法を知っていますか?Vuex:コンポーネント内にオブジェクトが表示されない

main.js

import Vue from 'vue' 

import VueResource from 'vue-resource' 
import VueRouter from 'vue-router' 
import VueI18n from 'vue-i18n' 

import routes from './config/routes' 
import locales from './lang/locales' 
import store from './store' 

//Routing support 
Vue.use(VueRouter); 
//Backend support 
Vue.use(VueResource); 
//Language support 
Vue.use(VueI18n); 


Vue.config.lang = 'nl'; 

Object.keys(locales).forEach(function (lang) { 
    Vue.locale(lang, locales[lang]) 
}); 

const router = new VueRouter({ 
    store, 
    mode: 'history', 
    base: '/app/', 
    routes: routes 
}); 

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

店/ index.js

:私は手動ですべてのコンポーネントに、ストアオブジェクトをインポートすることもできますが、それは本当にきれいではありません... 私のファイルは、次のようになり
import Vue from 'vue' 
import Vuex from 'vuex' 

import fleet from './modules/fleet' 

Vue.use(Vuex) 

export default new Vuex.Store({ 
    modules : { 
     fleet 
    } 
}) 

app.vue

<template> 
    <div id="page-content-wrapper"> 
     <nav-bar></nav-bar> 
     <div class="container-fluid"> 
      <div class="row"> 
       <router-view></router-view> 
      </div> 
     </div> 
    </div> 
</template> 
<script> 

    import NavBar from './assets/navBar.vue' 
    export default { 
     created() { 
      console.log(this.$store) 
     }, 
     components: { 
      NavBar 
     } 
    } 
</script> 

this.$store戻る未定義

答えて

0

CONSTルータ=新しいVueRouter({ 店、 モード: '歴史'、 塩基: '/アプリ/' 経路:経路})。

新しいVue({ ルータ})$ mount( '#app');

ストアはnew Vueに設定されるように設計されています

new Vue({ 
    el: '#app', 
    router, 
    store, 
    render: h => h(App) 
}) 

あなたが代わりにVueRouterインスタンスにそれを配置しました。

適切なコードを組み合わせる:

const router = new VueRouter({ 
    routes, 
    mode: 'history', 
    base: ... 
}); 

new Vue({ 
    el: '#app', 
    router, 
    store, 
    render: h => h(App) 
}) 
+0

申し訳ありませんすっごい、私は、このすべてに気付かなかった...ありがとう – GroovyP

関連する問題