title: Async/Await not working for VueX getter but works for log
body: <p>I have an object of convos with <em>userIDs</em> that I need to loop through and, inside the loop, I need to make a call to Firebase to get the corresponding <em>userName</em> and then return an object with the convos, userNames, and userIDs. </p>
  
  <p>I have tried using the async/await and the result I get from console.log is correct but my return statement directly after that, is undefined. Why is this happening? They are receiving the same object.</p>
  
  <p><strong>store.js</strong> getter snippet</p>
  
  <pre><code>getConvosObj: state =&gt; {
    var convoObj = {};
    var userConvos = state.userProfile.convos;
    async function asyncFunction() {
      for (const key in userConvos) {
        if (userConvos.hasOwnProperty(key)) {
          const userID = userConvos[key];
          var userName;
          await fire.database().ref('/users/' + userID + '/userName').once('value', async (snapshot) =&gt; {
            userName = await snapshot.val();
            convoObj[key] = {userName, userID}
          })
        }
      }
      console.log(convoObj);   //result: correct object
      return convoObj;         //result: undefined
    }
    asyncFunction();
  }
  </code></pre>