先直接貼上注入store的正確操作
一、引入store到vue組件中
(1)store.js
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
const state={
isCollapse:false
}
export default new Vuex.Store({
state
});
(2)main.js
import Vue from 'vue';
import App from './App';
import router from './router';
import store from '@/vuex/store';
/* eslint-disable no-new */
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app');
(3).vue
<template>
<div>test if store exits</div>
</template>
<script>
export default{
mounted(){
console.log("test store",this.$store);
}
}
</script>
小心,此處有坑,掉坑如下。。。在導入vue跟vuex時候,英文差把大小寫寫錯,把v小寫寫成了大寫(正因爲如此store注入不到vue中,vue文件理所當然拿取不到),結果前方一大堆bug找你,不是store is not define 就是state is not define....三姑六婆都找你...更無語的是,在js文件裏打出store是一個不報錯對象,在vue文件裏就成了undefine....此處有坑,前車之鑑,望友勿掉坑...
import Vue from 'vue';
import Vuex from 'Vuex';//!!!v要是小寫