React-Apollo, do not run component download request

Question

I am using awesome https://github.com/apollographql/react-apollo and I am trying to check if there is a better convention for loading data into components than how I am doing it now.

I installed my components using apollo HOC to load data into my components, for example:

const mainQuery = gql`
  query currentProfileData($userId:String, $communityId:String!){
    created: communities(id:$communityId) {
      opportunities{
          submittedDate
          approvalDate
          status
          opportunity{
            id
          }
      }
    }
  }
`;
const mainQueryOptions = {
  options: {
    variables: { userId: '_', communityId: '_' },
  },
};

const ComponentWithData = compose(
  graphql(mainQuery, mainQueryOptions),
)(Component);

This setting works fine, but with some problems.

• I get requests that are always executed twice, since I need to pass the details for refol to the request. I also have to pass some dummy data (otherwise called "_") to prevent the extraction of unnecessary data.

• componentWillReceiveProps, .

  • , .

, HOC apollo , ?

Answer 1

, refetch, . options , . , . :

const mainQueryOptions = {
  options: ({ userId, communityId }) => ({
    variables: { userId, communityId },
  },
});

Answer 2

.

@daniel , , . . , .

const mainQueryOptions = {
  skip: ({ community: { id: communityId } }) => !communityId,
  options: ({ community: { id: communityId }, user: { id: userId = '_' } }) => ({
    variables: { userId, communityId },
  }),
};

apillo api: http://dev.apollodata.com/react/api-graphql.html#graphql