<Мутация /> refetchQueries "Неизвестная директива "_"."

Я использую react-apollo и компонент <Mutation /> с refetchQueries

ОБНОВЛЕНИЕ_ТАСК

export const UPDATE_TASK = gql`
  mutation updateTask(
    $id: Int!
    $title: String!
    $priority: PriorityType!
    $assigneeId: String!
    $dueDate: Datetime!
    $details: String!
    $changedAt: Datetime!
  ) {
    updateIssueTaskById(
      input: {
        id: $id
        issueTaskPatch: {
          title: $title
          priority: $priority
          assigneeId: $assigneeId
          dueDate: $dueDate
          details: $details
          changedAt: $changedAt
        }
      }
    ) {
      issueTask {
        id
      }
    }
  }
`;

const onUpdateTask = ({ render }) => <Mutation mutation = {UPDATE_TASK} refetchQueries = {[{query: GET_TASKS_BY_USER_ID}]} awaitRefetchQueries = {true}>
    {(mutation, result, ...rest) => render({ mutation, result, rest })}
  </Mutation>

Это работает так, как и ожидалось, что первоначальная мутация публикуется, и мы получаем другой запрос точно так, как должны:

&lt;Мутация /&gt; refetchQueries &quot;Неизвестная директива &quot;_&quot;.&quot;

Это Query вызывает проблемы:

Запрос полезной нагрузки

[{
    "operationName": "getTasksByUserId",
    "variables": {},
    "query": "query getTasksByUserId($assigneeId: String!) {\n  tasks: allIssueTasks(condition: {assigneeId: $assigneeId, status: OPEN}) @_(get: \"edges\") {\n    edges @_(map: \"node\") {\n      node {\n        id\n        title\n        createdAt\n        priority\n        dueDate\n        details\n        status\n        assigneeId\n        creatorId\n        __typename\n      }\n      __typename\n    }\n    __typename\n  }\n}\n"
}]

Ответ

[{
    "errors": [{
        "message": "Unknown directive \"_\".",
        "locations": [{
            "line": 2,
            "column": 76
        }]
    }, {
        "message": "Unknown directive \"_\".",
        "locations": [{
            "line": 3,
            "column": 11
        }]
    }]
}]
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
296
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Директива @_ — это не встроенная директива, а добавленная graphql-lodash — экспериментальная клиентская библиотека, предназначенная для произвольного преобразования ответов GraphQL. Директива используется только самой библиотекой. Под капотом graphql-lodash фактически удаляет директиву перед отправкой запроса на сервер. Если бы он этого не сделал, сервер получил бы директиву, которую он не распознал, и выдал бы ошибку проверки, подобную той, которую вы видите.

Поскольку вы видите эту ошибку проверки, это означает, что либо вы вообще не используете graphql-lodash, либо неправильно настроили его. Инструкции по использованию библиотеки с react-apollo предоставлены здесь. Самый простой способ — использовать пользовательскую ссылку:

new ApolloLink((operation, forward) => {
  const { query, transform } = graphqlLodash(operation.query);
  operation.query = query;
  return forward(operation)
    .map(response => ({
      ...response,
      data: transform(response.data),
    }));
});

Если вы собираетесь инициировать запросы с помощью refetch или refetchQueries, вам следует использовать ссылку, подобную приведенной выше. Использование обёртки HOC не сработает, так как запросы будут отправляться напрямую на сервер без предварительного преобразования библиотекой.

Фантастическая работа, Дэниел :) Спасибо, теперь мне нужно решить, как вернуть эти данные из мутации ... поскольку, насколько я вижу, они не возвращены.

Jamie Hutber 13.03.2019 15:29

Другие вопросы по теме