Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/467.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 无法使用Apollo和GraphQL访问从refetchQueries返回的数据_Javascript_Reactjs_Graphql_Apollo_React Apollo - Fatal编程技术网

Javascript 无法使用Apollo和GraphQL访问从refetchQueries返回的数据

Javascript 无法使用Apollo和GraphQL访问从refetchQueries返回的数据,javascript,reactjs,graphql,apollo,react-apollo,Javascript,Reactjs,Graphql,Apollo,React Apollo,我可以在“网络”选项卡中成功看到我的重新蚀刻正在收集数据。但我看不到检索和使用这些数据的方法 下面是我如何处理refetch的,我希望数据是{(突变,结果,…rest)=>{的一部分,但是在rest Package.json "apollo-client": "^2.5.1", "graphql": "14.0.2", "graphql-tag": "2.10.0", "react-apollo": "2.3.3", 对象不访问对页面上显示数据的REFETCH查询的响应-这是的工作。的工作是

我可以在“网络”选项卡中成功看到我的重新蚀刻正在收集数据。但我看不到检索和使用这些数据的方法

下面是我如何处理refetch的,我希望数据是
{(突变,结果,…rest)=>{
的一部分,但是在
rest

Package.json

"apollo-client": "^2.5.1",
"graphql": "14.0.2",
"graphql-tag": "2.10.0",
"react-apollo": "2.3.3",
对象不访问对页面上显示数据的REFETCH查询的响应-这是
的工作。
的工作是更改数据,
的工作是访问数据(从服务器或缓存)-这就是为什么您会看到“refetch在网络选项卡中收集数据”,您在
refetchQueries
中记录的查询会在其自己的调用中单独触发,并且数据会被推入缓存,以便
s在屏幕上显示更新的数据

当你触发一个变异时,你会得到你要求的数据(如“result.data.updateIsueByTaskId”中所示),并且该数据会被推送到缓存中。在大多数情况下,这足以更新页面上观察该数据的任何
,但在某些情况下(例如列表,并且您已经向列表中添加了一个项目),您可能需要进行一些干预(例如使用
refetchquerys
update

在这种情况下,我怀疑您不需要使用
refetchQueries
,因为您正在变异单个对象,并且我怀疑您将在页面上显示该单个对象(借助
)。但是,如果您的数据在服务器上更改,您将希望保留
refetchQueries

下面是一个小的(丑陋的)例子,我将你的变异实现包装在一个获取数据的查询中。当你点击按钮时,它将触发变异(但是没有参数,所以我想不会有任何改变?),然后变异将通过用户ID重新提取
GET\u TASKS\u查询,
组件将看到更新的缓存,从而自动在其子项中显示新数据。(我没有使用查询的错误或加载状态,但已将它们放在那里,以便您了解它们)


{({数据,错误,加载})=>(
{data&&data.tasks.edges.map(edge=>(
{edge.node.id}>
{edge.node.title}
)}
{({onUpdate任务})=>(
更新任务
)}
)}
玩一下类似的游戏,了解它们是如何工作的。您可能需要向变异添加一些变量,以便数据发生更改,然后在屏幕上确认它发生了更改。尝试从变异中删除refetchQueries,看看它是否仍能按您的意愿进行更新


如果您发现在没有refetchQueries的情况下,您的数据无法按您希望的方式更新,但在有refetchQueries的情况下,数据会更新,请查看“更新”选项中的变异。它是refetchQueries的替代选项,允许您以预定的方式手动更新缓存,而不是对服务器进行往返调用以获取新数据。

很有趣,所以问题可能是应用程序一开始没有使用
缓存
。我必须查一下。因为它肯定不会更新atm:)
然后通过查询将新返回的服务器数据推送到使用该数据的任何组件中
这是我不确定该如何做的关键部分。我的理解是,默认情况下,这应该通过apollo实现。我想知道这是否是代码中的错误?我已更新了答案,以使其更清晰,并提供一个有效的示例简单地说,你需要将你的组件包装在一个文件中,因为这是你的数据提供者——refetchQueries只是告诉Apollo停止这些查询(应该是在某个地方使用的现有查询),更新缓存,并通知所有挂载的对象更新它们传递给其子对象的数据。再次,朋友,我实际上已将它们包装在
中,尽管它们与
采用
嵌套在一起。我不知道这是否是对其造成破坏的部分。我假设您使用的是react-adopt,我不熟悉,但当您只在
中装入
而不使用“采用”时,会发生什么情况?您得到了所需的吗?如果渲染道具的方法变得混乱,您也可以尝试使用
compose
graphql
HoC:
导出默认组合(graphql(通过用户ID获取任务,{name:getTasks})、graphql(更新任务,{name:updateTask}))(MyComponent)
  <Container {...this.props}>
    {({
      onUpdateTask,
    }) => {
        console.info(onUpdateTask); //see image
    }}
  </Container>
[{"data":{"tasks":{"edges":[{"node":{"id":1,"title":"Task 11212111","createdAt":"2019-03-12T12:14:21.640904+00:00","priority":"HIGH","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":2,"title":"1Task 211","createdAt":"2019-03-12T12:14:21.642818+00:00","priority":"MEDIUM","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":3,"title":"Task 1111","createdAt":"2019-03-12T12:14:21.644163+00:00","priority":"LOW","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":4,"title":"Cock","createdAt":"2019-03-12T12:14:21.645699+00:00","priority":"MEDIUM","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":5,"title":"Task 5 balls","createdAt":"2019-03-12T12:14:21.646978+00:00","priority":"LOW","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":6,"title":"Task 6","createdAt":"2019-03-12T12:14:21.648202+00:00","priority":"HIGH","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":7,"title":"Task 7","createdAt":"2019-03-12T12:14:21.649414+00:00","priority":"MEDIUM","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":8,"title":"Jamie","createdAt":"2019-03-12T12:14:21.650558+00:00","priority":"LOW","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":9,"title":"Task 911","createdAt":"2019-03-12T12:14:21.651912+00:00","priority":"HIGH","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"},{"node":{"id":10,"title":"Task 10","createdAt":"2019-03-12T12:14:21.653051+00:00","priority":"MEDIUM","dueDate":"2019-03-03T12:37:57.68033+00:00","details":"Some details","status":"OPEN","assigneeId":"auth0|5b448ea16d829f1018602bd6","creatorId":"auth0|5b448ea16d829f1018602bd6","__typename":"IssueTask"},"__typename":"IssueTasksEdge"}],"__typename":"IssueTasksConnection"}}}]
"apollo-client": "^2.5.1",
"graphql": "14.0.2",
"graphql-tag": "2.10.0",
"react-apollo": "2.3.3",
<Query query={GET_TASKS_BY_USER_ID} variables={{assigneeId: authStorage.get().id}}>
  {({ data, error, loading }) => (
    <div>
      {data && data.tasks.edges.map(edge => (
        <span>{edge.node.id}></span>
        <span>{edge.node.title}</span>
      )}
      <Container {...this.props}>
        {({onUpdateTask}) => (
          <button onClick={onUpdateTask}>Update Task </button>
        )}
      </Container>
    </div>
  )}
</Query>