title: Vue cannot read property of undefined
body: <pre><code>&lt;template&gt;
    &lt;f7-page&gt;
      &lt;f7-navbar&gt;
          &lt;f7-nav-left back-link="Zurück"&gt;&lt;/f7-nav-left&gt;
          &lt;f7-nav-title&gt;{{groupDetails.data.group.name}}&lt;/f7-nav-title&gt;
          &lt;f7-nav-right&gt;&lt;/f7-nav-right&gt;
      &lt;/f7-navbar&gt;
      &lt;f7-list&gt;
          &lt;f7-list-item&gt;{{$f7route.params.groupKey}}&lt;/f7-list-item&gt;
          &lt;f7-list-item&gt;{{groupDetails.data.owner.userID}}&lt;/f7-list-item&gt;
      &lt;/f7-list&gt;
    &lt;/f7-page&gt;
  &lt;/template&gt;
  &lt;script&gt;
  import *  as firebase from 'firebase'
  
  export default {
      beforeCreate: function() {
          var this_ = this
          firebase.firestore().collection("groups").doc(this_.$f7route.params.groupKey).onSnapshot({
              includeMetadataChanges: true
          }, function(doc) {
              this_.groupDetails = ({data: doc.data()})
              console.log(this_.groupDetails)
          })
  
      },
      data() {
          return {
              groupDetails: []
          }
      }
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>I dont know why but cant navigate on this Page view a Router. 
  "Cannot read property 'group' of undefined"" thats the Error.</p>
  
  <p>Does anyone know why?</p>