Как использовать apollo graphql (react) в js-функции в react native?

Вот так выглядит моя простая функция для синхронизации данных:

Функция

import { getData } from './api/index'

export default async function synchronize (navigator) {
  const data = await getData()
  // ... then store data to local db...
}

Я получаю данные с сервера с помощью RESTful API:

получить данные

import { Alert, AsyncStorage } from 'react-native'

async function getData () {
  try {
    const lastSynched = await AsyncStorage.getItem('data.lastSynched')
    const date = lastSynched ? Number(Date.parse(lastSynched)) / 1000 : 0
    const token = await AsyncStorage.getItem('auth.token')
    const uriBase = 'http://localhost:3000'

    let response = await fetch(`${uriBase}/get-data/${date}`, {
      method: 'GET',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
        'x-access-token': token
      }
    })
    let responseJson = await response.json()
    return responseJson
  } catch (error) {
    Alert.alert('Error', 'Could not synchronize data')
  }
}

export default getData

Но теперь я использую apollo graphQL, и я не понимаю, как получить данные с помощью запроса, поскольку я использую здесь функцию (synchronize ()), а не компонент.

Здесь вы не используете apollo. Вы пытаетесь выполнить запрос.

kat1330 27.04.2018 22:27
Поведение ключевого слова "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) для оценки ваших знаний,...
1
1
405
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

Думаю, хорошее начало будет с этого ссылка на сайт. Здесь у вас есть хорошие примеры использования клиента Apollo для выполнения запросов и получения данных.

Возможно, я не совсем понимаю, в чем проблема, но здесь высокий уровень использования Apollo.

Сначала вам нужно будет создать клиент Apollo и предоставить хотя бы URI для конечной точки GraphQL.

import ApolloClient from "apollo-boost";

const client = new ApolloClient({
  uri: "https://w5xlvm3vzz.lp.gql.zone/graphql"
});

После того, как вы создали клиент, вы должны выполнить свой запрос с ранее созданным клиентом, как показано ниже:

import gql from "graphql-tag";

client
  .query({
    query: gql`
      {
        rates(currency: "USD") {
          currency
        }
      }
    `
  })
  .then(result => console.info(result));

Убедитесь, что вы установили пакеты apollo-boost react-apollo graphql-tag graphql. Также убедитесь, что вы заключили свой запрос в тег GraphQL, как это, потому что он скомпилирует ваш запрос.

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