react.js 和 usemutation 的无限循环

Question

你好，我有这个代码：

import React, {useState} from "react";
import {Modal} from "react-bootstrap";
import {gql, useMutation} from "@apollo/client";

const Activation = (props) => {
    console.log("ABC")  
    const [show, setShow] = useState(true);
    const handleClose = () => setShow(false);
    const handleShow = () => setShow(true);

    const [message, setmessage] = useState("000")

    const GET_ACTIVITY = gql`
    mutation verifyaccount($token: String!){
    verifyAccount(token: $token){
    success,
    errors,
    } 
    }
    `;
    const [addchannel, {loading, error} ] = useMutation(GET_ACTIVITY, {
      onCompleted: (data) => {
          if (data.verifyAccount.success === true){
              setmessage("It is okay");
          }
          else{
              setmessage("It is not okay");
          }

      },
      onError: (error) => console.log("Error", error),
  });
addchannel({
      variables: {
          token: props.match.params.token
      }
  })

    return (
        <Modal show={show} onHide={handleClose} centered>
        <div className="login-form">
          <h3 className="h3 mb-3 font-weight-normal" style={{textAlign: "center"}}> {message}</h3>
        </div>
      </Modal>
    )
}
export default Activation;

其实这个组件是在我去url确认一个账号的时候用到的。每个人都是完美的，除了我收到“这不好”的消息，因为我有一个无限循环。我的意思是第一次发射时我得到的是“没关系”，但后来我只有“这不好”。

我不明白为什么会出现这个无限循环。

来自这部分

addchannel({
      variables: {
          token: props.match.params.token
      }
  })

因为当我删除这部分时，我没有无限循环但没有执行突变。

你能帮帮我吗？

非常感谢！

Answer 1

这可以回答您的问题：

改变这个：

addchannel({
      variables: {
          token: props.match.params.token
      }
  })

作者：

useEffect(() => {addchannel({
      variables: {
          token: props.match.params.token
      }
  })}, []);

react.js 和 usemutation 的无限循环

infinite loop with react.js and usemutation

reactjs

graphql

apollo-client