./store/state.js

export default {
  userInfo: { name: '' },
}

./store/mutations.js

export default {
  UPDATE_NAME(state, payload = {}) {
    state.userInfo.name = payload.name
  },
}

./store/mutations.js

export default {
  UPDATE_NAME(state, payload = {}) {
    state.userInfo.name = payload.name
  },
}

App.vue

<template>
  <div>
    <input type="text" v-model="name" />
    <span>{{ userInfo.name }}</span>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  computed: {
    ...mapState(['userInfo']),
    name: {
      get() {
        return this.userInfo.name
      },
      set(name) {
        this.$store.commit('UPDATE_NAME', { name })
      },
    },
  },
}
</script>