title: Changing object property through $set gives:" TypeError: Cannot read property 'call' of undefined "
body: <p>First of all, hello.</p>
  <p>I'm relatively new to web development and Vue.js or Javascript. I'm trying to implement a system that enables users to upload and vote for pictures and videos. In general the whole system worked. But because i got all of my information from the server, the objects used to show the files + their stats wasn't reactive. I tried to change the way i change the properties of an object from &quot;file['votes'] ) await data.data().votes&quot; to &quot;file.$set('votes', await data.data().votes)&quot;. However now i'm getting the TypeError: Cannot read property 'call' of undefined Error. I have no idea why this happens or what this error even means. After searching a lot on the internet i couldn't find anybody with the same problem. Something must be inheritly wrong with my approach.</p>
  <p>If anybody can give me an explanation for what is happening or can give me a better way to handle my problem, I'd be very grateful.</p>
  <p>Thanks in advance for anybody willing to try. Here is the Code section i changed:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>async viewVideo() {
    this.videoURLS = []
    this.videoFiles = []
    this.videoTitels = []
    var storageRef = firebase.storage().ref();
    var videourl = []
    console.log("try")
    var listRef = storageRef.child('User-Videos/');
    var firstPage = await listRef.list({
      maxResults: 100
    });
    videourl = firstPage
    console.log(videourl)
    if (firstPage.nextPageToken) {
      var secondPage = await listRef.list({
        maxResults: 100,
        pageToken: firstPage.nextPageToken,
      });
      videourl = firstPage + secondPage
  
    }
    console.log(this.videoURLS)
    if (this.videoURLS.length == 0) {
      await videourl.items.map(async refImage =&gt; {
  
        var ii = refImage.getDownloadURL()
        this.videoURLS.push(ii)
      })
  
      try {
        await this.videoURLS.forEach(async file =&gt; {
  
          var fale2 = undefined
          await file.then(url =&gt; {
            fale2 = url.substring(url.indexOf("%") + 3)
            fale2 = fale2.substring(0, fale2.indexOf("?"))
          })
          await db.collection("Files").doc(fale2).get().then(async data =&gt; {
            file.$set('titel', await data.data().titel)
            file.$set('date', await data.data().date)
            if (file.$set('voted', await data.data().voted)) {
              file.$set('voted', [])
            }
            file.$set('votes', await data.data().votes)
            if (file.$set('votes', await data.data().votes)) {
              file.$set('votes', 0)
            }
            await this.videoFiles.push(file)
            this.uploadDate = data.data().date
            console.log(this.videoFiles)
            this.videoFiles.sort(function(a, b) {
              return a.date - b.date;
            })
          })
        })
      } catch (error) {
        console.log(error)
      }
    }
  },</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>