Home.vue

<template>
  <div class="home">

    <ul id="postList">
      <li v-for="(post, name, index) in posts" :key=index>{{ post.message }}</li>
    </ul>
   
    <!-- <PlaceholderTweets msg="still works?"/> -->

  </div>
  
</template>

<script>
// @ is an alias to /src

// import PlaceholderTweets from '@/components/PlaceholderTweets.vue'

export default {
  name: 'home',
  data: function(){
    return {
      posts: []
    }
  },
  components: {
    // PlaceholderTweets
  },

  methods: {
    getPosts(){
      db.collection("posts").get().then(querySnapshot => {
          querySnapshot.forEach( doc => {
              // doc.data() is never undefined for query doc snapshots
              console.log(doc.id, " => ", doc.data());
              this.posts.unshift(doc.data())
          });
      }); 
    }

  },

  // This runs when the page loads
  mounted() {
    // console.log(db);

    this.getPosts();

  }
};
</script>