Как получить путь в файле макета в Гэтсби - PullRequest
1 голос
/ 11 апреля 2019

Я работаю с gasby, и здесь основным файлом всегда является layout.js, который является их родителем.Поскольку это родительский файл, как я могу получить реквизиты местоположения this.props.location.pathname внутри него?

Вот мой компонент макета

class Layout extends Component {
  componentWillMount() {
    console.log(this.props, 'dssssssssssssf')
  }

  render() {
    const { children } = this.props
    return(
      <StaticQuery
        query={graphql`
          query SiteTitleQuery {
            site {
              siteMetadata {
                title
              }
            }
          }
        `}
        render={data => (
          <>
            <div>
              <Provider store={store}>
                {children}
              </Provider>
            </div>
          </>
        )}
      />
    )
  }
}
Layout.propTypes = {
  children: PropTypes.node.isRequired
}

export default Layout.

1 Ответ

2 голосов
/ 11 апреля 2019

Как указано в документах Гэтсби:

В v1 компонент макета имел доступ к истории, местоположению и соответствию реквизит. В версии 2 только страницы имеют доступ к этим реквизитам; если вам это нужно реквизиты в компоненте макета, пропустите их со страницы.

Это означает, что вам нужно перейти туда, где отображается ваш компонент Layout (обычно это страница index.js или app.js), и напрямую передать информацию о местоположении:

import React from "react"
import Layout from "../components/layout"

export default props => (
  <Layout location={props.location}>
    <div>Hello World</div>
  </Layout>
)

Тогда вы можете использовать его в макете. Вы также можете прочитать больше здесь .

...