@apollo/客户端react钩子useQuery()数据未定义
@apollo/客户端react钩子useQuery()数据未定义
提问于 2021-03-02 01:23:38
我用react钩子apollo客户端做了一个gql片段，在网络上的请求是可以的，但是数据不能在react中获取…为什么？谢谢。
我的GQL和useQuery：
import gql from "graphql-tag";
import {useQuery} from "@apollo/client";
const AuthorFragment = {
entry: gql`
fragment AuthorFragment on Author {
... on User {
id
profile {
pseudo
picture
__typename
}
__typename
}
... on Guest {
username
picture
__typename
}
__typename
}`,
};
const MESSAGE_QUERY = gql`
query adminMessageSearch($offset: Int, $limit: Int) {
website {
id
adminMessageSearch (object: "comments", offset: $offset, limit: $limit) {
meta {
count
offset
limit
},
messages {
id
content
contentEditedAt
createdAt
status
ip
thread {
id
url
pageTitle
}
votes {
score
}
author {
...AuthorFragment
}
}
}
}
}
${AuthorFragment.entry}
`;
export const useMessageQuery = (offset, limit) => useQuery(MESSAGE_QUERY, {
variables: {
offset: offset|| 0, limit: limit || 10,
},
fetchPolicy: "network-only" });我的反应是：
import React, { useState } from 'react'
import {useMessageQuery} from "../../graphql/queries/messageQuery";
import Message from "./Message";
export const ListingMessage = () => {
const {loading,error, data} = useMessageQuery(0, 10);
if(loading) return 'Loading...';
if(error) return `Error! ${error.message}`;
return (
<div className="list-disc ">
<p > total: {data.website.adminMessageSearch.meta.count}
<br/>
</p>
</div>
)
}
export default ListingMessage;数据未定义，但我在网络中看到的请求graphql是正常的。我尝试异步=>等待我的代码useMessageQuery，但似乎不起作用。
你能帮我个忙吗？
非常感谢。
回答 1
Stack Overflow用户
发布于 2021-03-02 02:05:26
您的查询名称是adminMessageSearch，所以您可以通过使用data.adminMessageSearch来访问它，因为您使用的是data.website.adminMessageSearch.meta.count，没有导致未定义的data.website。所以修改一下
return (
<div className="list-disc ">
<p > total: {data.adminMessageSearch.website.adminMessageSearch.meta.count}
<br/>
</p>
</div>
)页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/66426704
复制相关文章
相似问题
腾讯云开发者
