after I have configured vuex, I found that I cannot use it within the component
this is main.js
import Vue from "vue"
import "es6-promise/auto"
import App from "./App"
import router from "./router"
import vuex from "vuex"
/* eslint-disable no-new */
Vue.use(vuex);
var store = new vuex.Store({//store
state:{
show:"aaaaaaa"
}
})
new Vue({
el: "-sharpapp",
router,
store,//store
components: { App },
template: "<App/>"
})
helloworld.vue
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<h2>Essential Links</h2>
<h1>11111{{store.state.count}}</h1>
</div>
</template>
<script>
export default {
created(){
this.fetchData()
},
watch:{
"$route":"fetchData"
},
methods:{
//
fetchData(){
console.log("1111")
console.log(store.state.count)
},
},
name: "HelloWorld",
data () {
return {
msg: "Welcome to Your Vue.js App"
}
},
}
</script>
then an error will be reported
Boss, what is wrong with my configuration and how to modify it