我有来自 cli 的最新 Vue 项目。只是在玩 vuex 和商店。
默认项目具有此初始化。
import Vue from 'vue';
import App from './App.vue';
import router from './router';
import store from './store';
import './registerServiceWorker';
Vue.config.productionTip = false;
new Vue({
router,
store,
render: (h) => h(App),
}).$mount('#app');
商店长这样:
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
export default new Vuex.Store({
state: {
stateName: 'STORE-NAME',
},
mutations: {
},
actions: {
},
});
我的证监会看起来像这样:
<template>
<div class="about">
<h1>This is the Probate page</h1>
<p>State Name: {{ localName }}</p>
</div>
</template>
<script lang="ts">
export default {
data(){
return {
localName: 'COMPONENT-NAME',
};
},
created(){
this.localName = this.$store.state.stateName;
},
};
</script>
运行“npm run serve”时出现的错误是:
ERROR in /Users/*/Documents/projects/legalcove-single-page-app/src/views/Probate.vue
27:14 Property 'localName' does not exist on type '{ data(): { localName: string; }; created(): void; }'.
26 |
> 27 | this.localName = this.$store.state.stateName;
| ^
28 |
29 | },
30 | };
Version: typescript ERROR in /Users/*/Documents/projects/lc-single-page-app/src/views/Probate.vue3.1.1
, tslint 5.11.027:31
Property '$store' does not exist on type '{ data(): { localName: string; }; created(): void; }'.
Time: 3011 ms
26 |
> 27 | this.localName = this.$store.state.stateName;
| ^
28 |
29 | },
但是在运行该应用程序时,我在浏览器中没有收到任何错误,并且它可以正常工作。我stateName
的屏幕上显示了价值。