Добавление оболочки для запросов graphQL - HO C или Render props - PullRequest
Новая
       2

Добавление оболочки для запросов graphQL - HO C или Render props

0 голосов
/ 20 февраля 2020

Я пытаюсь сделать оболочку для запросов graphQL, я пробовал это 

const GQLWrapper = ({ query, children}) => (
  <Query query={query}>
    {({ loading, error, data }) => {
      if (loading) {
        return null
      }
      if (error) {
        <QueryError />
      }
      const { gqlData } = data.page    
      return (
        <div>
          {children}
        </div>
      )
    }}
  </Query>
)

, но я не понимаю, как использовать рендер реквизиты для передачи данных в дочерний компонент.

Также, если это лучшее решение для использования HO C, пожалуйста, дайте мне знать (когда следует использовать один или другой). Спасибо

1 Ответ

1 голос
/ 20 февраля 2020

Вы просто делаете своих детей функцией и передаете туда данные 

return <div>{children(gqlData)}</div>;

Когда вы используете свою обертку, вы делаете: 

<GQLWrapper query={myquery}>
  {(gqlData) => <SomeComponent data={gqlData} />}
</GQLWrapper>
...