title: Firebase - Vue | Basic setup doesn't retrieve data
body: <p>I run into this problem, I've been trying to get Vue to retrieve at least the very basic setup from firebase. It doesn't. I've followed various routes and nothing worked, so maybe I'm missing out on something, maybe in plain sight.</p>
  
  <p>I don't have any errors in the console and everything seems to work fine, apart from the fact that nothing is retrieved. Network connections don't seem to retrieve any response that may be associated with the db.
  Here is a screengrab from firebase, maybe I misunderstood firebase and the setup:</p>
  
  <p><a href="https://ibb.co/fPTsQL" rel="nofollow noreferrer">https://ibb.co/fPTsQL</a></p>
  
  <p>// Main.js  </p>
  
  <pre><code>/* eslint-disable semi */
  // The Vue build version to load with the `import` command
  // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
  import Vue from 'vue';
  import App from './App';
  import router from './router';
  import VueFire from 'vuefire';
  
  Vue.use(VueFire);
  
  Vue.config.productionTip = false
  
  /* eslint-disable no-new */
  new Vue({
    el: '#app',
    router,
    components: { App },
    template: '&lt;App/&gt;'
  })
  </code></pre>
  
  <p>//App.vue</p>
  
  <pre><code>&lt;template&gt;
    &lt;div id="app"&gt;
      &lt;p&gt;This will render&lt;/p&gt;
  
      &lt;div v-for="message in messages" :key="message.text"&gt; &lt;!-- This will NOT --&gt;
      &lt;h4&gt;{{ message.title }}&lt;/h4&gt;
      &lt;p&gt;{{ message.text }}&lt;/p&gt;
      &lt;p&gt;{{ message.timestamp }}&lt;/p&gt;
  &lt;/div&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import firebase from 'firebase';
  
    var config = {
      apiKey: "IN THE CODE I HAVE A WORKING API KEY",
      authDomain: "vuemymessage.firebaseapp.com",
      databaseURL: "https://vuemymessage.firebaseio.com",
      projectId: "vuemymessage",
      storageBucket: "vuemymessage.appspot.com",
      messagingSenderId: "204332593971",
      timestampsInSnapshots: true
    };
    let app = firebase.initializeApp(config);
  
    let db = firebase.firestore();
  
    export default {
      name: "App",
      data(){
        return {
          messages: []
        }
      },
      firestore(){
        return {
          messages: db.collection('messages')
        }
      },
    }
  &lt;/script&gt;
  
  &lt;style&gt;
  #app {
  }
  &lt;/style&gt;
  </code></pre>