Nuxt에서 Vuex를 사용하는 방법을 기억하기 위해 만든 것

pages/index.vue

.<template>
  <div>
    {{message}}
    <EditForm />
  </div>
</template>

<script>
import EditForm from "./component/EditForm";

export default {
  computed: {
    message() {
      return this.$store.state.store.message;
    }
  },
  components: {
    EditForm
  }
};
</script>

pages/component/index.vue

<template>
  <div>
    <input :value="message" @input="doUpdate" />
  </div>
</template>

<script>
export default {
  computed: {
    message() {
      return this.$store.state.message;
    }
  },
  methods: {
    doUpdate(event) {
      this.$store.dispatch("store/doUpdate", event.target.value);
    }
  }
};
</script>

store/store.js

export default {
    name: 'store',
    state: {
        message: 'Hello Vue.js'
    },

    // 
    mutations: {
        setMessage(state, payload) {
            state.message = payload.message
        }
    },

    actions: {
        doUpdate({ commit }, message) {
            commit('setMessage', { message })
        }
    }
}

메모(넘어진 곳)