Expose addSmartQuery/Subscription in API

This commit is contained in:
Guillaume Chau
2017-04-22 23:36:37 +02:00
parent 2f7e7395c0
commit 64c1a3ada1
3 changed files with 37 additions and 5 deletions
+31 -1
View File
@@ -29,11 +29,13 @@ Integrates [apollo](http://www.apollostack.com/) in your [Vue](http://vuejs.org)
- [Skipping the query](#skipping-the-query)
- [Advanced options](#advanced-options)
- [Reactive Query Example](#reactive-query-example)
- [Manually adding a smart Query](#manually-adding-a-smart-query)
- [Mutations](#mutations)
- [Subscriptions](#subscriptions)
- [subscribeToMore](#subscribetomore)
- [subscribe](#subscribe)
- [Skipping the subscription](#skipping-the-subscription)
- [Manually adding a smart Subscription](#manually-adding-a-smart-subscription)
- [Pagination with `fetchMore`](#pagination-with-fetchmore)
- [Skip all](#skip-all)
- [Multiple clients](#multiple-clients)
@@ -527,6 +529,20 @@ export const resolvers = {
}
```
### Manually adding a smart Query
You can manually add a smart query with the `$apollo.addSmartQuery(key, options)` method:
```javascript
created () {
this.$apollo.addSmartQuery('comments', {
// Same options like above
})
}
```
*Internally, this method is called for each query entry in the component `apollo` option.*
## Mutations
Mutations are queries that changes your data state on your apollo server. For more info, visit the [apollo doc](http://dev.apollodata.com/core/apollo-client-api.html#ApolloClient\.mutate).
@@ -814,7 +830,7 @@ apollo: {
// Subscriptions
$subscribe: {
// When a tag is added
tags: {
tagAdded: {
query: gql`subscription tags($type: String!) {
tagAdded(type: $type) {
id
@@ -890,6 +906,20 @@ You can also access the subscription directly and set the `skip` property:
this.$apollo.subscriptions.tags.skip = true
```
### Manually adding a smart Subscription
You can manually add a smart subscription with the `$apollo.addSmartSubscription(key, options)` method:
```javascript
created () {
this.$apollo.addSmartSubscription('tagAdded', {
// Same options like '$subscribe' above
})
}
```
*Internally, this method is called for each entry of the `$subscribe` object in the component `apollo` option.*
## Pagination with `fetchMore`
*[Here](https://github.com/Akryum/apollo-server-example/blob/master/schema.js#L21) is a simple example for the server.*
+4 -2
View File
@@ -95,14 +95,16 @@ export class DollarApollo {
return observable
}
option (key, options) {
addSmartQuery (key, options) {
const smart = this.queries[key] = new SmartQuery(this.vm, key, options, false)
smart.autostart()
return smart
}
subscribeOption (key, options) {
addSmartSubscription (key, options) {
const smart = this.subscriptions[key] = new SmartSubscription(this.vm, key, options, false)
smart.autostart()
return smart
}
defineReactiveSetter (key, func) {
+2 -2
View File
@@ -39,7 +39,7 @@ const launch = function launch () {
if (this._apolloQueries) {
// watchQuery
for (let key in this._apolloQueries) {
this.$apollo.option(key, this._apolloQueries[key])
this.$apollo.addSmartQuery(key, this._apolloQueries[key])
}
}
@@ -51,7 +51,7 @@ const launch = function launch () {
if (apollo.$subscribe) {
for (let key in apollo.$subscribe) {
this.$apollo.subscribeOption(key, apollo.$subscribe[key])
this.$apollo.addSmartSubscription(key, apollo.$subscribe[key])
}
}