Как мне использовать фрагменты на объединении в Vue.js? - PullRequest
Новая
       18

Как мне использовать фрагменты на объединении в Vue.js?

0 голосов
/ 22 июня 2019

Кто-нибудь знает, как использовать фрагменты в союзах?Я видел документацию по React (https://www.apollographql.com/docs/react/advanced/fragments/#fragments-on-unions-and-interfaces), но не очень на Vue. У меня есть запрос, который возвращает два фрагмента, оба с __typename. 

query {
    search(queryString: "lin") {
        ... on Professor {
            __typename
            name
        }
        ... on Course { 
            __typename
            name
            moduleCode
        }
    }
}

Когда приложение Vue запускается, яполучил ошибку «Вы используете фрагменты в своих запросах, но либо в клиенте Apollo не установлена ​​опция addTypename: true, либо вы пытаетесь записать фрагмент в хранилище без __typename». Это код изmy vue app. 

data() {
    return {
        result: []
    };
},
apollo: {
    // Query with parameters
    result: {
        // gql query
            query: gql'
                query search($queryString: String!) {
                    ... on Professor {
                        __typename
                        name
                    }
                    ... on Course { 
                        __typename
                        name
                        moduleCode
                    }
                }
            ',
            // Static parameters
            variables() {
               return {
                  queryString: 'lin mei'
                }
          }
    }
},

// In my apollo client options
// Override default cache
cache: new InMemoryCache(
    { addTypename: true }
}

Полученные сообщения об ошибках

  • Вы используете фрагменты в своих запросах, но либо не имеете addTypename: trueпараметр установлен в клиенте Apollo, или вы пытаетесь записать фрагмент в хранилище без __typename. Пожалуйста, включите параметр addTypename и включайте __typename при записи фрагментов, чтобы клиент Apollo мог точно сопоставлять фрагменты.
  • ПРЕДУПРЕЖДЕНИЕ О УСТРАНЕНИИ: использование фрагментов без __typename является неподдерживаемым поведением и будет удалено в будущих версиях клиента Apollo.t addPypename в true сейчас.
  • Ошибка GraphQL: фрагмент по Профессору не может быть распространен внутри запроса;Ошибка GraphQL: фрагмент по курсу не может быть распространен внутри запроса;Ошибка GraphQL: переменная $ queryString объявляется поиском, но не используется
  • Ошибка GraphQL: фрагмент по Профессору не может быть распространен внутри запроса;Ошибка GraphQL: фрагмент по курсу не может быть распространен внутри запроса;Ошибка GraphQL: переменная $ queryString объявляется поиском, но не используется

Кто-нибудь может привести пример получения двух фрагментов из запроса в vue?

1 Ответ

2 голосов
/ 22 июня 2019

Ваш запрос не верный.Вы назвали свою операцию search, но вы, вероятно, намеревались вместо этого запросить это поле в корневом типе.Что-то вроде: 

query ($queryString: String!) {
  search(queryString: $queryString) {
    ... on Professor {
      __typename
      name
    }
    ... on Course { 
      __typename
      name
      moduleCode
    }
  }
}

Примечание. Поскольку я не знаю вашу схему, я не могу точно сказать, что приведенный выше запрос также является допустимым.Если сервер, к которому вы обращаетесь, предоставляет интерфейс GraphiQL или GraphQL Playground, вы должны использовать его для проверки ваших запросов, поскольку оба эти инструмента используют специфичную для схемы подсветку синтаксиса.

Возможно, вы захотите добавить id или_id поле для каждого фрагмента, чтобы обеспечить правильное поведение кэширования.Если ни одно из полей не существует, вам нужно предоставить пользовательскую функцию dataIdFromObject.См. документы для получения дополнительной информации.

...