阿波罗更新查询未调用?

Posted

技术标签:

【中文标题】阿波罗更新查询未调用?【英文标题】:Apollo updateQueries Not Called? 【发布时间】:2017-03-03 04:12:49 【问题描述】:

我正在研究 GitHunt-React 和 GitHunt-API 中的 Apollo pub-sub。当我运行这些应用程序并输入新评论时,评论由提交调用保存,然后 updateQueries 代码块在此处运行:

const CommentsPageWithMutations = graphql(SUBMIT_COMMENT_MUTATION, 
  props( ownProps, mutate ) 
    console.log('in CommentsPageWithMutations');
    return 
      submit( repoFullName, commentContent )  <==RUNS THE MUTATION
        debugger;
        return mutate(
          variables:  repoFullName, commentContent ,
          optimisticResponse: 
            __typename: 'Mutation',
            submitComment: 
              __typename: 'Comment',
              id: null,
              postedBy: ownProps.currentUser,
              createdAt: +new Date,
              content: commentContent,
            ,
          ,
          updateQueries: 
            Comment: (prev,  mutationResult ) => 
              debugger; // <== RUNS AFTER THE MUTATION IS SENT TO SERVER
              const newComment = mutationResult.data.submitComment;
              if (isDuplicateComment(newComment, prev.entry.comments)) 
                return prev;
              
              return update(prev, 
                entry: 
                  comments: 
                    $unshift: [newComment],
                  ,
                ,
              );
            ,
          ,
        );
      ,
    ;
  ,
)(CommentsPage);

我已将此代码复制到我的应用程序中。突变已正确保存,但 updateQueries 代码块运行:

const CreateIMPageWithMutations = graphql(CREATE_IM_MUTATION, 
    props( ownProps, mutate ) 
        debugger;
        return 
            submit( fromID, toID, msgText )  <==SAVES SUCCESSFULLY
                debugger;
                return mutate(
                    variables: 
                        "fromID": fromID,
                        "toID": toID,
                        "msgText": msgText
                    ,
                    optimisticResponse: 
                        __typename: 'Mutation',
                        createIM: 
                            __typename: 'createIM',
                            fromID: fromID,
                            toID: toID,
                            createdAt: +new Date,
                            msgText: msgText,
                        ,
                    ,
                    updateQueries: 
                        createIM: (prev,  mutationResult ) => 
                            debugger; <== THIS CODE BLOCK IS NEVER CALLED
                            const newMsg = mutationResult.data.createIM;

                            return update(prev, 
                                entry: 
                                    IMs: 
                                        $unshift: [newMsg],
                                    ,
                                ,
                            );
                        ,
                    ,
                );
            ,
        ;
    ,
)(CreateIM);

为什么我的 updateQueries 调用不运行?提前感谢大家提供任何信息。

更新:每个请求,这里是 CREATE_IM_MUTATION 的代码:

const CREATE_IM_MUTATION = gql`
                mutation createIM ($fromID: String!, $toID: String!, $msgText: String!)
                    createIM(fromID: $fromID, toID: $toID, msgText: $msgText)
                        fromID
                        toID
                        msgText
                    
                
`;

更新:根据 Slack 上 @fabio_oliveira 的请求,这是我正在更新的查询:

const GETIMS_QUERY = gql`
query getIMs($fromID: String!, $toID: String!)
  instant_message(fromID:$fromID, toID: $toID)
    id,
    fromID,
    toID,
    msgText
  
  `;

【问题讨论】:

突变结果中的data.error是不是一定是没有设置的?你能分享定义查询“createIM”的代码吗? ...还有...什么版本的 react-apollo? React-Apollo v3.10.8。我在哪里可以设置断点来查看突变的结果?突变已成功更新数据库,但我很乐意查看 data.error 以查看是否有任何内容。 我在 ownProps 中发现了 data.error。加载设置为false,预期的记录已经以数组形式返回,data.error为undefined. 页面上是否有名为createIM 的活动查询? 【参考方案1】:

Slack 上的@fabio_oliveira 提供了答案。在 updateQueries 中,我不得不将 key 的名称更改为 getIMS,即原始数据收集查询的名称——不是 Mutation 查询的名称:

                updateQueries: 
                     getIMs: (prev,  mutationResult ) => 
                        debugger;
                        [.....]

【讨论】:

以上是关于阿波罗更新查询未调用?的主要内容,如果未能解决你的问题,请参考以下文章

如何在突变后更新阿波罗缓存(使用过滤器查询)

突变后反应阿波罗不更新数据

反应阿波罗突变和乐观更新

JPA 查询未在列表中返回更新的结果

更新nestjs/graphql后没有通过标头

阿波罗客户端在反应原生的初始重新加载中返回未定义