Apollo GraphQL: дважды вызывать запрос с помощью apolloClient.query?

Question

У меня есть следующий запрос:

const GET_MY_USERINFOFORIMS_QUERY = gql`
query($userID: String!){
  myUserDataForIMs(userID:userID){
    name_first
    name_last
    picture_medium
  }
} `;

const withUserInfoForIMs = graphql(GET_MY_USERINFOFORIMS_QUERY, {
    options({ userID }) {
        return {
            variables: { userID: `${userID}`}
        };
    }
    ,
    props({ data: { loading, myUserDataForIMs } }) {
        return { loading, myUserDataForIMs };
    },
    name: 'GET_MY_USERINFOFORIMS_QUERY',
});

Из документов Apollo кажется, что я могу дважды вызвать этот запрос изнутри компонента, используя apolloClient.query, выполнив что-то вроде этого:

client.query({ query: query1 })
client.query({ query: query2 })

Есть ли способ дважды вызвать запрос, каждый раз передавая новый идентификатор пользователя?

Answer 1

Нашел это.:)

        const localThis = this;
        this.props.ApolloClientWithSubscribeEnabled.query({
            query: GET_MY_USERINFOFORIMS_QUERY,
            variables: {userID: fromID},
        }).then((result) => {
            localThis.setState({ fromAvatar: result.data.myUserDataForIMs[0].picture_thumbnail });
        });

        this.props.ApolloClientWithSubscribeEnabled.query({
            query: GET_MY_USERINFOFORIMS_QUERY,
            variables: {userID: toID},
        }).then((result) => {
             localThis.setState({ toAvatar: result.data.myUserDataForIMs[0].picture_thumbnail });
        });

Если есть лучший / более эффективный способ, пожалуйста, опубликуйте его.

Answer 2

Вы можете сделать это, передав Аполлона refetch() Метод в реквизит вашего компонента вместе с данными:

const withUserInfoForIMs = graphql(GET_MY_USERINFOFORIMS_QUERY, {
    options({ userID }) {
        return {
            variables: { userID: `${userID}`}
        };
    },
    props({ data: { refetch, loading, myUserDataForIMs } }) {
        return { refetch, loading, myUserDataForIMs };
    },
    name: 'GET_MY_USERINFOFORIMS_QUERY',
});

... тогда где-нибудь в вашем компоненте вы можете повторно получить данные "вручную":

theUserWasChangedSomehow(userID) {
  this.props.refetch({ userID });
}