我正在尝试制作一个用于web3身份验证的模块。为此,我有一个函数,它获取用户的公共地址,并对后端进行GraphqQL查询,以查看它是否存在于数据库中。
export const useWeb3 = async () => {
const [ user, setUser ] = useState({})
if (!(window as any).ethereum) {
window.alert('Please install MetaMask first.');
return;
}
let web3: Web3 | undefined = undefined
if (!web3) {
try {
// Request account access if needed
await (window as any).ethereum.enable();
// We don't know window.web3 version, so we use our own instance of Web3
// with the injected provider given by MetaMask
web3 = new Web3((window as any).ethereum);
} catch (error) {
window.alert('You need to allow MetaMask.');
return [user];
}
}
const coinbase = await web3.eth.getCoinbase()
if (!coinbase) {
window.alert('Please activate MetaMask first.')
return [user]
}
console.log("COINBASE", coinbase)
const publicAddress = coinbase.toLowerCase();
// setLoading(true);
const { data } = useQuery(QUERY_USER_BY_PUBLIC_ADDRESS, {
variables: { publicAddress }
})
if(data) setUser(data)
return [user]
}
所以我有一个定制的钩子useWeb3()。我把它做成了一个钩子,这样我就可以在里面调用useQuery了。我在另一个组件中导入useWeb3,当我尝试像这样使用它时:
const [user] = useWeb3()
它说'Promise<{}[] x undefined>‘不是一个数组type.ts(2461) Welcome.component.tsx(34,11):您忘记使用’等待‘了吗?
问题是我如何在一个单独的函数中实现获取公共地址和查询后端的逻辑,以便在其他组件中使用它?
发布于 2022-03-25 12:01:46
如果您只想返回QUERY_USER_BY_PUBLIC_ADDRESS
响应数据,并且不希望将结果呈现为React组件的一部分,那么这里不需要使用useQuery
React钩子。只需直接使用Apollo Client's query
function,它将返回一个承诺:
...
// `client` here is your instantiated `ApolloClient` instance
const result = await client.query({
query: QUERY_USER_BY_PUBLIC_ADDRESS,
variables: { publicAddress }
});
...
https://stackoverflow.com/questions/71612852
复制相似问题