title: Error in Vuex Computed property was assigned to but it has no setter
body: <p>I am trying to display a list of Invites to groups.</p>
  
  <p>Sometimes this component displays as expected, and sometimes not at all. This error returns:</p>
  
  <pre><code>vue.runtime.esm.js?2b0e:619 [Vue warn]: Computed property "groupInvites" was assigned to but it has no setter.
  
  found in
  
  ---&gt; &lt;InviteList&gt; at src/components/Invites/InviteList.vue
         &lt;UserProfile&gt; at src/views/UserProfile.vue
           &lt;App&gt; at src/components/App.vue
             &lt;Root&gt;
  </code></pre>
  
  <p>Here is the it component generating the error:</p>
  
  <pre><code>&lt;template&gt;
    &lt;div class=""&gt;
      &lt;h4 mt-10 class="text-warning"&gt;Your Current Invites:&lt;/h4&gt;
      &lt;table class="table"&gt;
        &lt;thead&gt;
          &lt;tr&gt;
            &lt;th&gt;Group Name&lt;/th&gt;
            &lt;th&gt;Invited By&lt;/th&gt;
            &lt;th&gt;Date&lt;/th&gt;
            &lt;th&gt;Actions&lt;/th&gt;
          &lt;/tr&gt;
        &lt;/thead&gt;
        &lt;tbody&gt;
          &lt;tr v-for="(invite, i) in groupInvites" :key="`${i}-${invite.id} `"&gt;
            &lt;td&gt;
              &lt;router-link :to="`/groups/${invite.group_id}`" class="lightbox"&gt;
                {{ invite.group_name }}
              &lt;/router-link&gt;
            &lt;/td&gt;
            &lt;td&gt;{{ invite.sender_id }}&lt;/td&gt;
            &lt;td&gt;{{ moment(invite.created_at).strftime("%A, %d %b %Y %l:%M %p") }}&lt;/td&gt;
            &lt;td scope="row"&gt;
              &lt;a class="btn btn-success mr-3"  @click="acceptInvite(invite)"&gt;
                Join Group
              &lt;/a&gt;
              &lt;a flat color="grey" @click="deleteInvite(invite.id)"&gt;
                &lt;i class="fa fa-trash " &gt;&lt;/i&gt;
              &lt;/a&gt;
            &lt;/td&gt;
          &lt;/tr&gt;
        &lt;/tbody&gt;
      &lt;/table&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import moment from 'moment-strftime';
  import InvitesService from '../../services/InvitesService';
  import UsersService from '../../services/UsersService';
  
  export default {
    name: "InviteList",
    components: {
      // NewInvite
    },
    props: {
      // user: {
      //   type: Object,
      //   required: true
      // },
    },
    computed: {
      user() {
        return this.$store.state.auth.user
      },
      groupInvites() {
        return this.$store.state.invites.groupInvites;
      }
    },
    mounted() {
      this.getInvites();
    },
    methods: {
      async getInvites () {
        console.log('in invitelist, getting invites for user: ', this.user.id)
        this.groupInvites = await this.$store.dispatch("getGroupInvites", this.user);
      },
      async getUser (id) {
        this.sender = await UsersService.getUserById({
          id: id
        });
      },
      deleteInvite: async function (id) {
        if(confirm("Do you really want to reject this invite?")) {
          let response = await InvitesService.deleteInvite(id)
          if (response.status === 200) {
            console.log('In Invite.vue, invite deleted, about to emit');
            this.$emit('invite-deleted');
          }
        }
        this.getInvites();
      },
      async acceptInvite(invite) {
        let result = await InvitesService.acceptInvite(invite.invitation_code)
        this.$emit("membership-created");
        console.log('this is the membership created: ', result.data)
        // window.analytics.track('Group Joined', {
        //   title: this.group.name,
        //   user: this.$store.getters.user.username
        // });
        this.getInvites();
      },
      moment: function (datetime) {
        return moment(datetime);
      }
    }
  };
  &lt;/script&gt;
  </code></pre>
  
  <p>Separately, here is the store module:</p>
  
  <pre><code>import InvitesService from '@/services/InvitesService'
  
  export const state = {
    groupInvites: []
  }
  
  export const mutations = {
    setGroupInvites(state, groupInvites) {
      state.groupInvites = groupInvites;
    }
  } 
  
  export const actions = {
    getGroupInvites({ commit }, user) {
      console.log('in store. getting invites, for user: ', user.id)
      InvitesService.getAllUserInvitation(user.id)
        .then(resp =&gt; {
          console.log('in store, getGroupInvites,this is groupInvites: ', resp.data);
          commit('setGroupInvites', resp.data);
        });
    }
  }
  
  export const getters = {
  
  }
  </code></pre>
  
  <p>Incidentally, getGroupInvites is being called twice. here are the console.logs:</p>
  
  <pre><code>in invitelist, getting invites for user:  9
  invites.js?d00b:16 in store. getting invites, for user:  9
  InvitesService.js?109c:10 in service getting all user invites for user:  9
  invites.js?d00b:16 in store. getting invites, for user:  undefined
  InvitesService.js?109c:10 in service getting all user invites for user:  undefined
  </code></pre>
  
  <p>notice user is undefined on the second go around.</p>