react native apollo client useQuery invalid hook call error

Posted

技术标签:

【中文标题】react native apollo client useQuery invalid hook call error【英文标题】: 【发布时间】:2021-05-27 23:08:15 【问题描述】:

我们如何在 dispatch 函数中使用 appollo/client useQuery?当我尝试它时,我得到了这个错误 有些人认为我找到了,但我无法修复。 我们如何在 react 或 react native 中使用 apollo 客户端挂钩事件库?

 Error: Invalid hook call. Hooks can only be called inside of the body of a 
function component. This 
could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as 
React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb .me/react-invalid-hook-call for tips about how to debug and 
fix this problem.
- node_modules\react-native\Libraries\LogBox\LogBox.js:148:8 in registerError 
.
.
.

actions.js

import  useQuery, gql  from '@apollo/client';
  const LOGIN_USER_QUERY = gql`
query
loginUser(email:$String, password:$String)
    userId
    token
    expiredIn


`
 export const loginUser = (email, password)=>dispatch=> 
    const  loading, error, data  = useQuery( LOGIN_USER_QUERY, 
        variables:
            email,
            password
        
    ).then(
        data=>
            dispatch(
                type: $AT.LOGIN_USER,
                payload: data.loginUser
            )
        
    ).catch(err=>
        throw err;
    )
    if(!data) throw "You couldn't login, Please try again.";
    console.log(data);
    ;

【问题讨论】:

【参考方案1】:

谢谢我

const [LoginUserMutation] = useMutation(LOGIN_USER_MUTATION);
const onLoginPressed = () => 
        LoginUserMutation(
            variables: 
                email: username.username,
                password: password.password
            ).then(data=>
            console.log(data);
        ).catch(err=>
            throw err;
        )
    


【讨论】:

以上是关于react native apollo client useQuery invalid hook call error的主要内容,如果未能解决你的问题,请参考以下文章

将 react-native 添加到 monorepo 后,React apollo hooks 失败

使用 Apollo 和 React-native 的身份验证问题

登录表单 React Native 和 Apollo

错误:尝试解析模块 @apollo/client React Native 时

通过 Apollo 在 React Native 应用程序上使用 GraphQL 查询

错误:createNetworkInterface 不是 React Native 和 Apollo 客户端上的函数