お世話になっております。
現在Vuex
とTypescript
を使用してカウンターアプリを作成しています。
質問
Vuex
のストアをthis.$store
で参照することができない。
this.$store
→ TS2339: Property '$store' does not exist on typethis['$store']
→ 正常に動作する
this['$store']
では正常に動作することから、store
は問題なく実装できていると考えてます。
また、increment()
実行時のthis
をダンプすると、$store
を持っていることは確認できてます。
実際のコードは下記の通りです。
<template>
<div class="test">
<span class="test__highlight">Cout:</span>{{ count }}
<button @click="decrement">
-
</button>
<button @click="increment">
+
</button>
</div>
</template>
<style lang="scss" scoped></style>
<script lang="ts">
import { mapGetters } from 'vuex';
export default {
computed: {
...mapGetters(['count']),
},
methods: {
increment() {
console.log(this.$store);
// TS2339: Property '$store' does not exist on type '{ increment(): void; decrement(): void; }'
// エラーは発生しない
this['$store'].dispatch('increment');
},
decrement() {
this['$store'].dispatch('decrement');
},
},
};
</script>
お力添えいただけますと幸いです。
よろしくお願いいたします。