Как я могу использовать Apollo в VueJS в пользовательском плагине? - PullRequest
Новая
       15

Как я могу использовать Apollo в VueJS в пользовательском плагине?

0 голосов
/ 14 февраля 2019

Я работаю над сайтом VueJS, который использует apollo для доступа к api graphql.Вместо того, чтобы иметь один и тот же запрос в нескольких компонентах, я хотел бы хранить все, что связано с пользовательским плагином, доступ к которому осуществляется через $api или this.$api

Я создал это, но больше не кажетсячтобы выполнить запросы, я подхожу к этому неправильно?Вот плагин, который я написал: 

// api.js

import {
  ACTIVE_TICKET_QUERY,
  BACKLOG_QUERY,
  TODO_QUERY,
  IN_PROGRESS_QUERY,
  TO_REVIEW_QUERY,
  TO_DEPLOY_QUERY,
  DONE_QUERY,
  PEOPLE_QUERY,
  PROJECT_QUERY
} from '../constants/graphql'

const optionsDefaults = {
  data: {
    activeTickets: 0,
    backlog: {
      'issues': []
    },
    todo: {
      'issues': []
    },
    inProgress: {
      'issues': []
    },
    toReview: {
      'issues': []
    },
    toDeploy: {
      'issues': []
    },
    done: {
      'issues': []
    },
    people: {},
    projects: {}
  },
  methods: {
    combinedIssues () {
      return {
        'backlog': this.backlog ? this.backlog.issues : [],
        'todo': this.todo ? this.todo.issues : [],
        'inProgress': this.inProgress ? this.inProgress.issues : [],
        'toReview': this.toReview ? this.toReview.issues : [],
        'toDeploy': this.toDeploy ? this.toDeploy.issues : [],
        'done': this.done ? this.done.issues : []
      }
    },
    wipIssues () {
      return {
        fixer: {
          ...this.todo.issues,
          ...this.inProgress.issues
        },
        tester: {
          ...this.toReview.issues
        }
      }
    }
  },
  apollo: {
    activeTickets: {
      query: ACTIVE_TICKET_QUERY,
      pollInterval: 120000
    },
    backlog: {
      query: BACKLOG_QUERY,
      pollInterval: 120000
    },
    todo: {
      query: TODO_QUERY,
      pollInterval: 120000
    },
    inProgress: {
      query: IN_PROGRESS_QUERY,
      pollInterval: 120000
    },
    toReview: {
      query: TO_REVIEW_QUERY,
      pollInterval: 120000
    },
    toDeploy: {
      query: TO_DEPLOY_QUERY,
      pollInterval: 120000
    },
    done: {
      query: DONE_QUERY,
      pollInterval: 120000
    },
    people: {
      query: PEOPLE_QUERY,
      pollInterval: 120000
    },
    projects: {
      query: PROJECT_QUERY,
      pollInterval: 120000
    }
  }
}

export default {
  install (Vue, opts) {
    const options = { ...optionsDefaults, ...opts }

    Vue.prototype.$api = new Vue(options)
  }
}
...