vue apollo 4 не возвращает результаты запроса graphql - PullRequest
0 голосов
/ 13 июля 2020

В попытке использовать версию 4 из Vue apollo в сотрудничестве с API композиции, как показано в этом руководстве , мы не можем получить какой-либо результат из стандартного запроса graphql .

Часть нашей настройки:

// src/boot/apollo.ts
import { createHttpLink } from 'apollo-link-http'
import { InMemoryCache } from 'apollo-cache-inmemory'
import { ApolloClient } from 'apollo-client'
import { DefaultApolloClient } from '@vue/apollo-composable'
import { provide } from '@vue/composition-api'

const httpLink = createHttpLink({ uri: "http://localhost:5000/graphql", })
const cache = new InMemoryCache()
const apolloClient = new ApolloClient({ link: httpLink, cache, })

export default ({ app }) => {
  app.setup = () => { provide(DefaultApolloClient, apolloClient) }
}

Теперь попытка использовать совершенно допустимый запрос, который действительно возвращает результаты на игровой площадке graphql, возвращает undefined для allAcounts:

// src/pages/Index.vue
<template>
  <q-page padding>
    <h2 v-if="loading">Loading...</h2>
    <h4 v-else>Done loading</h4>
    <div v-for="account in allAccounts" :key="account.accountIdentifier">
      {{ account.accountIdentifier }}
    </div>
  </q-page>
</template>

<script lang="ts">
import { defineComponent, watch } from '@vue/composition-api'
import { useQuery, useResult } from '@vue/apollo-composable'
import gql from 'graphql-tag'

export default defineComponent({
  setup() {
    const allAccountsQuery = gql`
      query allAccounts {
        accounts {
          accountIdentifier
        }
      }
    `
    const { result, loading } = useQuery(allAccountsQuery)
    console.log('loading ', loading) // false
    console.log('result ', result)   // undefined
    const allAccounts = useResult(result)

    return { onClick, profile, allAccounts, loading }
  },
})
</script>

Он возвращает только Done loading, но ни одна учетная запись не возвращается. Хотя контент правильно отображается через площадку graphql:

введите описание изображения здесь

1 Ответ

0 голосов
/ 14 июля 2020

По-видимому, это известная проблема с vue -apollo 4, несовместимым с любой версией выше, чем "@vue/composition-api": "0.5.0". Таким образом, при переходе на более раннюю версию проблема была временно устранена до тех пор, пока vue-apollo 4 не объединит исправление .

yarn add @vue/composition-api@0.5.0
...