vuex 子组建获取store中state为undefined,main.js中import store 后在footer.vue用this.$store.state.count获取值为undefined,但是如果把store里定义的store直接粘贴到main.js里面,在footer.vue里就可以获取到值,为什么为什么为什么为什么???????
main.js
import Vue from 'vue';
import App from './App.vue';
import VueRouter from "vue-router";
import VueResource from 'vue-resource';
import Vuex from 'vuex';
import store from './vuex/store';
//开启debug模式
Vue.config.debug = true;
Vue.use(VueRouter);
Vue.use(VueResource);
Vue.use(Vuex);
import Home from './component/home.vue';
import Login from './component/login.vue';
import First from './component/first.vue';
// 创建一个路由器实例
// 并且配置路由规则
const router = new VueRouter({
mode: 'history',
base: __dirname,
routes: [{
....//?路由配置
}]
})
new Vue({
el: '#app',
router: router,
store: store,
render: h => h(App)
})
store.js
import Vue from 'Vue';
import Vuex from 'vuex';
Vue.use(Vuex);
const store = new Vuex.Store({
state: {
count: 0
},
mutations: {
increment (state) {
state.count++
}
},
getter:{
}
})
module.exports = store
footer.vue
<template>
<div id="footer">{{count}}</div>
</template>
<script type="text/javascript">
import Vue from 'vue'
import {
mapGetters
} from 'vuex'
export default {
data() {
return {
}
},
computed: {
count() {
return this.$store.state.count;
}
}
}
</script>```
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…