From 64c1a3ada14ff2ea442cde167f238fdccb98779f Mon Sep 17 00:00:00 2001 From: Guillaume Chau Date: Sat, 22 Apr 2017 23:36:37 +0200 Subject: [PATCH] Expose addSmartQuery/Subscription in API --- README.md | 32 +++++++++++++++++++++++++++++++- src/dollar-apollo.js | 6 ++++-- src/index.js | 4 ++-- 3 files changed, 37 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index cbb000d..eb3304d 100644 --- a/README.md +++ b/README.md @@ -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.* diff --git a/src/dollar-apollo.js b/src/dollar-apollo.js index 62a3607..a15fa55 100644 --- a/src/dollar-apollo.js +++ b/src/dollar-apollo.js @@ -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) { diff --git a/src/index.js b/src/index.js index 20c517c..f5c2eb0 100644 --- a/src/index.js +++ b/src/index.js @@ -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]) } }