Vue Apollo - Как правильно получить данные? - PullRequest
0 голосов
/ 07 апреля 2019

У меня много проблем с получением данных фильма с этой конечной точки, используя vue-apollo .

Конечная точка: http://movie -database-graphql.herokuapp.com/ graphiql

И вот как я его настраиваю (кстати, для определения стиля):

main.js

import Vue from 'vue'
import App from './App.vue'

// Plugins
import './plugins/vuetify'
import VueApollo from 'vue-apollo'
import ApolloClient from 'apollo-boost'

const apolloClient = new ApolloClient({
  uri: 'http://movie-database-graphql.herokuapp.com/graphql'
});

const apolloProvider = new VueApollo({
  defaultClient: apolloClient,
})

Vue.use(VueApollo);

Vue.config.productionTip = false

new Vue({
  apolloProvider,
  render: h => h(App)
}).$mount('#app')

Iполагаю, проблема заключается в том, как я называю базу данных через Apollo, но пока не уверен.Я пробовал много способов, следуя документации и всегда терпя неудачу.

MovieList.vue (Компонент с запросом)

<template>
  <v-container fluid grid-list-md>
    <v-layout row wrap>
      <h4 v-if="$apollo.loading">Loading...</h4>
      <v-flex v-for="movie in movies" :key="movie.id" xs12 sm6>
          <v-card height="150px">
            <v-layout row>
              <v-avatar size="125" tile>
                <v-img :src="movie.poster_path" contain></v-img>
              </v-avatar>
              <v-flex xs12 sm6>
                <v-card-title primary-title>
                  <h3>{{ movie.title }}</h3>
                </v-card-title>
              </v-flex>
            </v-layout>
          </v-card>
      </v-flex>
    </v-layout>
  </v-container>
</template>

<script>
import gql from "graphql-tag"

export default {
  name: "MovieList",
  data: () => { return { movies: [] } },
  apollo: {
    movies: gql`
    query AllMoviesQuery {
        movies(query: "Start Wars") {
            id
            title
            poster_path
        }
    }`
  }
};
</script>

Doты понимаешь что мне не хватает?Я не получаю данные фильма (ошибки не отображаются ...). Массив фильмов всегда пуст

1 Ответ

1 голос
/ 07 апреля 2019

Просто опечатка - аргумент query в вашем запросе:

Start Wars

вместо

Star Wars

Если вы используете это же значение в GraphiQL, вы также получите пустые результаты.

...