Я использовал этот учебник https://css-tricks.com/build-a-dynamic-jamstack-app-with-gatsbyjs-and-faunadb/ в качестве руководства по обновлению динамического содержимого с помощью faunadb и gatsbyjs. Сейчас у меня все работает в определенной степени. Проблема, с которой я сталкиваюсь, заключается в том, что если я обновляю базу данных вручную или, в конечном итоге, в лямбда-функции, я хочу, чтобы запрос graphql вызывал изменение состояния и повторную визуализацию в ответ. Что происходит, я вижу новые данные только при обновлении страницы. Согласно этой статье, предполагается, что это гидратация на стороне клиента, но я не получаю желаемого эффекта при изменении БД.
Любая помощь будет принята с благодарностью
Вот моя страница гэтсби
import React, { useState } from 'react';
import Layout from "../components/layout"
import { gql } from "apollo-boost"
import { useQuery } from "@apollo/react-hooks"
import { graphql } from "gatsby"
const HIT_COUNTER = gql`
query HitCounter{
findHitCounterByID(id: "0248392") {
amount
}
}
`
const IndexPage = () => {
const { loading, data } = useQuery(HIT_COUNTER);
return (
<Layout>
{data.findHitCounterByID.amount}
</Layout>
)
}
export default IndexPage
В gatsbybrowser.js я делаю следующее
import React from "react"
import ApolloClient from "apollo-boost"
import { ApolloProvider } from "react-apollo"
const client = new ApolloClient({
uri: "https://graphql.fauna.com/graphql",
request: operation => {
operation.setContext({
headers: {
Authorization: `Bearer ${process.env.GATSBY_FAUNA_DB}`,
},
})
},
})
export const wrapRootElement = ({ element }) => (
<ApolloProvider client={client}>{element}</ApolloProvider>
)