Как я могу сделать страницу индекса моего сайта Gatsby одной из динамически генерируемых страниц? - PullRequest
Новая
       19

Как я могу сделать страницу индекса моего сайта Gatsby одной из динамически генерируемых страниц?

1 голос
/ 23 января 2020

У меня есть сайт Gatsby, который запрашивает информацию из API Wordpress REST с GraphQL для динамического создания страниц сайта. Я бы хотел, чтобы моя индексная страница была домашней страницей, которая создается динамически, т.е. home.html

Я видел этот пост, который был похож На Gatsby CMS, как я могу установить страницу о как страница индекса

Однако у них есть файл about.js, который соответствует их странице about, то есть они могут экспортировать его как компонент и использовать его в индексе, или они могут даже просто скопировать содержимое этого файла. файл до index.js. Домашняя страница, которую я хочу установить в качестве индекса, создается динамически и использует запрос GraphQL, который нельзя использовать вне шаблона page.js. Поэтому я не вижу простого способа скопировать это в другой файл.

Полагаю, мой последний вариант - настроить сервер на указание файла stati c в public/home.html и использовать его в качестве сайта root, но тот, кто публикуется в этом сообщении, пытается удержать людей от этого.

Есть идеи?

Вот страница. js шаблон, который генерирует страницы сайта: 

const PageTemplate = ({ data }) => (
    <Layout>
        {<h1 dangerouslySetInnerHTML={{ __html: data.currentPage.title }} />}
        {
           renderBlocks(gatherBlocks(data.currentPage.acf.page_blocks, data))
        }
    </Layout>
);

export default PageTemplate;

export const pageQuery = graphql`
    query ($id: String!) {
        currentPage: wordpressPage(id: {eq: $id}) {
            title
            id
            parent {
                id
            }
            template
            acf {
                page_blocks {
                block_type {
                    acf_fc_layout
                    cs_title
                    cs_text
                }
                wordpress_id
                }
            }
        }
    }
`;

А вот моя страница указателя: 

import React from "react"

import Layout from "../components/global/Layout"

const IndexPage = () => (
  <Layout>
    <h1>Hi people</h1>
    <p>Welcome to the Tank Gatsby site.</p>
    <p>Now go build something great.</p>
  </Layout>
)

export default IndexPage

1 Ответ

0 голосов
/ 27 января 2020

Я смог решить эту проблему, скопировав содержимое шаблона page.js в index.js, но вместо обычного запроса GraphQL, который нельзя использовать вне шаблона страницы, я использовал useStaticQuery вместо этого и жестко закодировал идентификатор страницы индекса, с которой я получал данные.

...