Как получить данные внутри компонента после того, как он доступен через graphql в реаги? - PullRequest
Новая
       5

Как получить данные внутри компонента после того, как он доступен через graphql в реаги?

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

У меня есть родительский компонент, который выполняет запрос: 

export const GET_VESSEL = gql`
  query vesselById($id: ID!) {
    vesselById(id: $id) {
      flagName
      flagCode
    }
  }
`;

После этого у меня появляется ошибка, загрузка и данные: 

const { loading, error, data } = useQuery(GET_VESSEL,
    {
      variables: {
        id: props.vesselId
      }
    }
  );

  if (loading) return <div style={{ padding: '1rem' }}>Loading...</div>
  if (error) return <div style={{ padding: '1rem' }}>Error loading data</div>

  const vesselData = data.vesselById;

Отсюда у меня это в моем return: 

return (
    <SubHeader data={vesselData} />
  );

Проблема, с которой я столкнулся, состоит в том, что у моего дочернего компонента <SubHeader /> есть реквизиты, которые возвращают undefined, и затем реквизиты входят после первоначального рендеринга. Так как дочерний компонент рендерится до того, как данные поступят, я получаю неопределенное значение в качестве реквизита, поэтому он не загружает в него реквизиты моего дочернего компонента. Как лучше всего с этим справиться?

...