Question

我在一个页面 localhost:8080/authors/1

我发了一个帖子，当我发帖时，我得到了一个新的 ID 2。使用这个新 ID，我想从 localhost:8080/authors/1 跳转到页面 localhost:8080/authors/2。

在作者表单中：

import {useHistory} from 'react-router-dom';
const history = useHistory()
const onSubmit = async data => {
    const response = await onUpdateData({author: data});
    history.push(`/authors/${response?.data?.createAuthor?.id}`);
  }

在 localhost:8080/authors/:id 我使用 useParams() 来获取 id

    const authorId = useParams()?.id;    
          const { loading, error, data } = useQuery(fetchAuthor, {
                variables: {id: authorId} })
                if(loading) {
                  return(<div> Loading </div>)
                }
                if(error) {
                  return(<div> error </div>)
                }
                  return (<AuthorForm initialValues={formTranslator(data)}/>);
        
            }

在推送钩子 useHistory 后，我得到“react_devtools_backend.js:2430 警告：React 检测到由“x”调用的钩子顺序发生了变化。如果不修复，这将导致错误和错误。有关更多信息，请阅读 Hooks 规则

Answer 1

我发现很难使用 apollo useQuery。使用 ApolloClient 和 useEffects 问题消失了，从现在开始我在使用 useQuery 时会非常小心。

Answer 2

解决方案是在 useQuery 中添加 skip

推送钩子 useHistory 后，我得到“警告：React 检测到由...调用的钩子顺序发生了变化”

2 个答案: