首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >无法呈现具有Apollo-link-rest和ReactJS的数组中的嵌套对象

无法呈现具有Apollo-link-rest和ReactJS的数组中的嵌套对象
EN

Stack Overflow用户
提问于 2019-04-25 07:24:31
回答 1查看 702关注 0票数 0

正在尝试获取要在页面上呈现的嵌套数据downloads.copy。我使用Apollo客户端开发工具查看数据,但不会呈现到页面上。我已经搜索了apollo-link-rest问题。我确信这是一些语法问题--或者不是。任何帮助/见解都将非常感谢。

代码语言:javascript
复制
import React, { Component } from "react";
import { graphql } from "react-apollo";
import gql from "graphql-tag";

const Query = gql`
  query tool {
    tools @rest(type: "ToolsPayload", path: "some-api/tools") {
      id
      headerTitle
      description
      downloads @type(name: "ToolsPayloadDownloads") {
        copy
      }
    }
  }
`;

class Tool extends Component {
  render() {
    const { loading, error, tools } = this.props;
    if (loading) {
      return <h4>Loading...</h4>;
    }
    if (error) {
      return <h4>{error.message}</h4>;
    }
    return (
      <div>
        {tools.map(tool => {
          return (
            <div key={tool.id}>
              <h1>{tool.headerTitle}</h1>
              // ** CAN'T GET THE DOWNLOADS COPY TO RENDER ** // 
              <h1>{tool.downloads.copy}</h1>
            </div>
          );
        })}
      </div>
    );
  }
}

export default graphql(Query, {
  props: ({ data }) => {
    if (data.loading) {
      return {
        loading: data.loading
      };
    }
    if (data.error) {
      return {
        error: data.error
      };
    }
    return {
      tools: data.tools,
      loading: false
    };
  }
})(Tool);
代码语言:javascript
复制
{
   [
      {
        "id": "1025",
        "headerTitle": "Title",
        "downloads": [
            {
                "id": "1234",
                "copy": "Some copy",

            }
        ]
    }, 
      {
        "id": "1026",
        "headerTitle": "Title2",
        "downloads": [
            {
                "id": "5678",
                "copy": "Some copy2",

            }
        ]
    },

  ]
}
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-04-25 08:11:01

downloads是一个使用数组的tool.downloads[0].copy

查询应在downloads中包含id字段,以便正确缓存ToolsPayloadDownloads类型。

您可以使用react开发工具检查/检查apollo缓存数据/详细信息。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/55839837

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档