在调用fetchMore之后,如何停止执行Mutation多次?

时间:2018-11-12 02:12:44

标签: reactjs graphql apollo react-apollo apollo-client

我使用loadMore按钮和基于光标的分页来调用fetchmore,就像在松弛视频中一样。 问题是,如果我运行send命令发送一条消息,它将创建一条消息,调用fetchMore的次数已达到该次数。 有想法吗?

查询部分:

<Query
          query={GET_MESSAGES}
          variables={{ chatID, limit: LIMIT, cursor }}
          fetchPolicy="network-only"
        >
          {({ data, loading, error, subscribeToMore, fetchMore }) => {
            if (loading) {
              return <div style={{ height: "100%" }}>Loading</div>;
            }

            if (error) {
              return <div>Error: {error.message}</div>;
            }

            if (!unsubscribe) {
              unsubscribe = subscribeToMore({
                document: NEW_MESSAGE_SUB,
                variables: { chatID },
                updateQuery: (prev, { subscriptionData }) => {
                  const { newMessageSubscribe } = subscriptionData.data;
                  console.log("SUBSCRIBE EXECUTED");
                  if (!newMessageSubscribe) {
                    return prev;
                  }
                  prev.getMessages.messages = [
                    newMessageSubscribe,
                    ...prev.getMessages.messages
                  ];

                  return prev;
                }
              });
            }

            return (
              <Fragment>
                {/* <Affix>{chatDate}</Affix> */}
                <MessageList
                  messages={data.getMessages.messages}
                  handleEnd={this.handleEnd}
                  fetchMore={fetchMore}
                  messagesRef={this.messagesRef}
                />
              </Fragment>
            );
          }}
        </Query>

        <InputForm chatID={chatID} />

0 个答案:

没有答案