fix: improve data handling fix #274

Author: Guillaume Chau

src/dollar-apollo.js

@@ -77,7 +77,11 @@ export class DollarApollo {
   }
 
   get loading () {
-    return this.vm.$data.$apolloData && this.vm.$data.$apolloData.loading !== 0
+    return this.vm.$data.$apolloData.loading !== 0
+  }
+
+  get data () {
+    return this.vm.$data.$apolloData.data
   }
 
   addSmartQuery (key, options) {

src/index.js

@@ -10,6 +10,10 @@ const keywords = [
   '$subscribe',
 ]
 
+function hasProperty (holder, key) {
+  return typeof holder !== 'undefined' && holder.hasOwnProperty(key)
+}
+
 const launch = function launch () {
   const apolloProvider = this.$apolloProvider
 
@@ -37,15 +41,17 @@ const launch = function launch () {
     defineReactiveSetter(this.$apollo, 'error', apollo.$error)
     defineReactiveSetter(this.$apollo, 'watchLoading', apollo.$watchLoading)
 
+    // Apollo Data
+    Object.defineProperty(this, '$apolloData', {
+      get: () => this.$data.$apolloData,
+      enumerable: true,
+      configurable: true,
+    })
+
     // watchQuery
     for (let key in apollo) {
       if (key.charAt(0) !== '$') {
-        let propHasKeyProperty = false
-        if (typeof this.$props !== 'undefined') {
-          propHasKeyProperty = this.$props.hasOwnProperty(key)
-        }
-
-        if (!this.hasOwnProperty(key) && !propHasKeyProperty && !this.$data.hasOwnProperty(key)) {
+        if (!hasProperty(this, key) && !hasProperty(this.$props, key) && !hasProperty(this.$data, key)) {
           Object.defineProperty(this, key, {
             get: () => this.$data.$apolloData.data[key],
             enumerable: true,

src/smart-query.js

@@ -23,6 +23,21 @@ export default class SmartQuery extends SmartApollo {
     }
 
     super(vm, key, options, autostart)
+
+    this.hasDataField = this.vm.$data.hasOwnProperty(key)
+    if (this.hasDataField) {
+      Object.defineProperty(this.vm.$data.$apolloData.data, key, {
+        get: () => this.vm.$data[key],
+        enumerable: true,
+        configurable: true,
+      })
+    } else {
+      Object.defineProperty(this.vm.$data, key, {
+        get: () => this.vm.$data.$apolloData.data[key],
+        enumerable: true,
+        configurable: true,
+      })
+    }
   }
 
   get client () {
@@ -105,11 +120,11 @@ export default class SmartQuery extends SmartApollo {
       // No result
     } else if (!this.options.manual) {
       if (typeof this.options.update === 'function') {
-        this.vm.$set(this.vm.$data.$apolloData.data, this.key, this.options.update.call(this.vm, data))
+        this.setData(this.options.update.call(this.vm, data))
       } else if (data[this.key] === undefined) {
         console.error(`Missing ${this.key} attribute on result`, data)
       } else {
-        this.vm.$set(this.vm.$data.$apolloData.data, this.key, data[this.key])
+        this.setData(data[this.key])
       }
     } else if (!hasResultCallback) {
       console.error(`${this.key} query must have a 'result' hook in manual mode`)
@@ -120,6 +135,10 @@ export default class SmartQuery extends SmartApollo {
     }
   }
 
+  setData (value) {
+    this.vm.$set(this.hasDataField ? this.vm.$data : this.vm.$data.$apolloData.data, this.key, value)
+  }
+
   catchError (error) {
     super.catchError(error)
     this.loadingDone()