$ストアが定義されていないのはなぜですか？

Question

私はvuejsとvuexを使ってプロジェクトを開発するのに苦労していますが、コンポーネントのthis.$store.state.countではうまくいきません。どうして？

マイ設定：

"vuex": "^2.0.0" 

store.js：

import Vue from 'vue' 
import Vuex from 'vuex' 
Vue.use(Vuex) 

export default new Vuex.Store({ 
    state: { 
    count: 12 
    }, 
    mutations: { 
    increment (state) { 
     state.count++ 
    } 
    }, 
    strict: true 
}) 

main.js：

import store from './vuex/store' 
import Vue from 'vue' 

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

component.js：

<script> 
export default { 
    name: 'landing-page', 
    created:() => { 
     console.log('status2') 
     console.log(this.$store.state.count) 
    } 
    } 
</script> 

エラー：

Uncaught TypeError: Cannot read property '$store' of undefined 

Answer 1

このストアを直接編集することはありません。

突然変異を誘発します。

ように（component.js）：

<script> 
import store from './vuex/store' 

export default { 
    name: 'landing-page', 
    computed: { 
    counter() { 
     return store.state.count // get state 
    } 
    }, 
    created:() => { 
    store.commit('increment') // set state 
    } 
} 
</script>