Gatsby load JSON data at runtime

问题

I have a Gatsby site, there is a careers page that uses Google Hire JSON feed.

I need to make it so that when someone in HR adds a new job posting (and the JSON updates) the careers page shows the new job. At the moment I'm using GraphQL with StaticQuery, so it is loading the data at build time, I need to get it to load at runtime but not sure how the best (and simplest) way to do this is?

I'm using gatsby-source-hire-with-google plugin to connect and load in the JSON

Here is how the component works at the moment

import React from "react";
import { StaticQuery, graphql } from "gatsby";
import "./main.css";

const MainCareers = () => (
  <StaticQuery
    query={graphql`
      query GoogleHirePositions {
        allHireWithGoogleJob {
          nodes {
            title
            id
            url
            jobLocation {
              address {
                addressLocality
                addressCountry
              }
            }
          }
        }
      }
    `}
    render={data => (
                <ul>
                  {data.allHireWithGoogleJob.nodes.map(edge => (
                    <li className="job-item" key={edge.id}>
                      <a href={edge.url} target="_blank">{edge.title}</a>
                      <div className="job-location">
                        {edge.jobLocation.address.addressLocality}
                        {", "}
                        {edge.jobLocation.address.addressCountry}
                      </div>
                    </li>
                  ))}
                </ul>

    )}
  />
);

export default MainCareers;

I tried to get it to work with componentDidMount but I think I'll need to load another way from GraphQL?

来源：https://stackoverflow.com/questions/58872782/gatsby-load-json-data-at-runtime