Как обновить переменные в опросе React-Hooks Apollo? - PullRequest
Новая
       26

Как обновить переменные в опросе React-Hooks Apollo?

0 голосов
/ 06 марта 2020

Я использую @apollo/react-hooks для опроса данных из запроса GraphQL каждые 5 мин.

Мой запрос принимает список параметров, включая текущее время даты, например: 

const MyComponent = ({ query }) => {
    const {loading, error, data} = useQuery(query, {
      variables: {
          variable1: valVariable1,
          variable2: valVariable2,
          variable3: valVariable3,
          currentLocalDateTime: getCurrentLocalDateTime(),
      },
      pollInterval: 300000
    });
    if (loading) {
      return <h1>Loading...</h1>;
    };
    if (error) {
      return <h1>Error! {JSON.stringify(error)}</h1>;
    }
    return <div> Data: {JSON.stringify(data)}</div>;
});

Допустим, я вызываю свой первый запрос в «2020-03-06 08h: 00mn», используя pollInterval, определенный выше, мой второй запрос будет вызван в 08h: 05mn «, а третий будет вызван в 08h: 10mn»

Ожидаемое поведение

Когда я просматриваю свой запрос в сети Chrome через 12 минут, я вижу 3 запроса с различными значениями временной переменной:

  • Запрос 1: variables.currentLocalDateTime === "2020-03-06 08h: 00mn"

  • Запрос 2: variables.currentLocalDateTime === "2020-03- 06 08 ч: 05 мин "

  • Запрос 3: variables.currentLocalDateTime ===" 2020-03-06 08 ч: 10 мин "

Текущее поведение

  • Запрос 1: variables.currentLocalDateTime === "2020-03-06 08h: 00mn"
  • Запрос 2: variables.currentLocalDateTime === «2020-03-06 08h: 00mn "
  • Запрос 3: variables.currentLocalDateTime ===" 2020-03-06 08h: 00mn "

Что я пытался сделать

  • Я пытался дождаться события onCompleted от useQuery, а затем обновить переменные, но это не помогло, потому что оно будет вызываться только 1-й раз (и я думаю, когда новые данные войдите, но я не уверен).

  • Я попытался использовать useLazyQuery вместо useQuery, а затем использовать setInterval() для обновления моих переменных и затем снова вызвать запрос как это: 

const MyComponent = ({ query }) => {
    const [getMyData, { loading, data }] = useLazyQuery(query);
    if (loading) {
        return <h1>Loading...</h1>;
    };
    if (error) {
        return <h1>Error! {JSON.stringify(error)}</h1>;
    }
    // Remove the previous created interval then:
    setInterval(() => {
        const newVariables = {...variables};
        newVariables['currentLocalDateTime'] = getCurrentLocalDateTime();
        getMyData({variables: newVariables});
      }, 300000);

    return <div> Data: {JSON.stringify(data)}</div>;
}

Но похоже, что я переопределяю опрос Apollo по умолчанию, используя setInterval «грязным способом». Так что я не уверен, если это решение.

Есть ли какие-либо отзывы или опыт для обновления переменных опроса React Apollo?

...