1

我的 GraphQLServer 查询：

query  {
  sources {
    name
    id
  } 
}

返回对象数组，如下所示：

{
  "data": {
    "sources": [
      {
        "name": "bootstrap.css",
        "id": 1
      },
      {
        "name": "normalize.css",
        "id": 2
      }
    ]
  }
}

试图了解如何从 React (redux) 调用它。我试过了：

function mapQueriesToProps( {ownProps, state}) {
 return {
   data: {
     query: gql`
      query {
        sources {
         id
         name
        }
      }
   `,
   forceFetch: false,
   returnPartialData: false,
  },
 };
};

但什么也没有发生。只需加载：是的。我正在使用 apollo-client 并根据文档将其全部连接起来（我认为）。我的意思是我正在使用 connect(mapQueriesToProps) 等。

  • 查询何时实际运行？
  • 它会在组件加载时自动运行吗？
  • 我需要做一个步骤来等待数据返回吗？
  • 组件如何知道等待数据？
  • 返回数组可以吗？我在文档中找不到任何返回数组的示例。
  • 我只想运行一次，不做任何投票或任何事情。这是唯一的方法吗？

这是我对 Apollo 的第一次测试。任何指导都值得赞赏，因为文档对于初学者来说相当简陋。

4

2 回答 2

0

您是否尝试过命名查询？即写作query abc {而不是仅仅query {。如果这样可以解决问题，您应该在 react-apollo 上提交问题。

如果它不起作用，您可以通过检查控制台中是否有任何错误并在浏览器实际发出请求时检查网络选项卡来开始缩小错误范围。

于 2016-07-26T22:08:20.527 回答
0

奇怪的是，第一种方法对我有用......

假设：

import gql from 'graphql-tag';
import { graphql } from 'react-apollo';

您可能只能（例如）：

const getSources = gql`
  query {
    sources {
     id
     name
    }
  }
`;

export default graphql(getSources) (connect(mapStateToProps, mapDispatchToProps)(YouContainer));

YouContainer props.data会有你的查询结果。

这第二种方法也有效（可能是最好的方法）：

const getSources = graphql(gql`
   _your_query_here_
`);

const connector = connect(mapStateToProps, mapDispatchToProps);
export default connector(getSources(YourContainer));

正如@helfer 提到的，您还应该为您的查询命名。

于 2016-09-26T10:08:38.457 回答