Manual mode

This commit is contained in:
Guillaume Chau
2017-09-14 11:55:28 +02:00
parent 65f9088afd
commit f6207dae97
2 changed files with 21 additions and 2 deletions
+15
View File
@@ -408,6 +408,7 @@ These are the available advanced options you can use:
- `error(error)` is a hook called when there are errors, `error` being an Apollo error object with either a `graphQLErrors` property or a `networkError` property.
- `loadingKey` will update the component data property you pass as the value. You should initialize this property to `0` in the component `data()` hook. When the query is loading, this property will be incremented by 1 and as soon as it no longer is, the property will be decremented by 1. That way, the property can represent a counter of currently loading queries.
- `watchLoading(isLoading, countModifier)` is a hook called when the loading state of the query changes. The `countModifier` parameter is either equal to `1` when the query is now loading, or `-1` when the query is no longer loading.
- `manual` is a boolean that disable the automatic property update. You then need to specify a `result` callback (see example below).
```javascript
@@ -466,6 +467,20 @@ If you use `ES2015`, you can also write the `update` like this:
update: data => data.ping
```
Manual mode example:
```javascript
{
query: gql`...`,
manual: true,
result ({ data, loading }) {
if (!loading) {
this.items = data.items
}
},
}
```
### Reactive Query Example
Here is a reactive query example using polling:
+6 -2
View File
@@ -217,17 +217,21 @@ export class SmartQuery extends SmartApollo {
this.loadingDone()
}
const hasResultCallback = typeof this.options.result === 'function'
if (typeof data === 'undefined') {
// No result
} else if (typeof this.options.update === 'function') {
this.vm[this.key] = this.options.update.call(this.vm, data)
} else if (data[this.key] === undefined) {
console.error(`Missing ${this.key} attribute on result`, data)
} else {
} else if (!this.options.manual) {
this.vm[this.key] = data[this.key]
} else if (!hasResultCallback) {
console.error(`${this.key} query must have a 'result' hook in manual mode`)
}
if (typeof this.options.result === 'function') {
if (hasResultCallback) {
this.options.result.call(this.vm, result)
}
}