vuexのstateの変化をvueで検知する方法

vuexはインストール済みとする。
インストールしていない人はこちらの記事を参照。

vuexの基本的な使い方 導入方法と変数の取得・更新

vuexの設定

//プロジェクトディレクトリ/resources/js/store/index.js

//中略
state: {
        value: "aaaa",
    },
    getters: {
        getValue(state) {
            return state.value
        }
    },
    mutations: {
        updateValue(state, value) {
            state.value = value
        },
    }

//中略

Vueファイルの設定

//プロジェクトディレクトリ\resources\js\components\page\Hoge.vue
<template>
    <div>
            {{getValue}}
            <button @click="change">vuexの値チェンジ</button>
    </div>
</template>
<script>
export default {

computed: {
    //vuexのstateの中身をcomputedにより監視
        getValue() {
            return this.$store.getters.getValue;
        }
 },
methods:{
        change(){
            this.$store.commit("updateValue", 'iiii'); //vuexの関数を呼び出す
        },
    }
}
</script>