标签: react-apollo

我有以下组件的查询和变异,但我的组件没有收到数据和变异道具.

我在代码中做错了什么或丢失了什么？查询确实执行了,它只是没有传递下来.this.props.mutate以及this.props.data未定义.

class ResetConfirm extends React.Component {
  static propTypes = {
    intl: intlShape.isRequired,
    token: React.PropTypes.string,
    data: React.PropTypes.shape({
      loading: React.PropTypes.bool.isRequired,
      checkToken: React.PropTypes.array,
    }).isRequired,
    mutate: React.PropTypes.func.isRequired,
  }

  submitForm = (model) => {
    this.setState({
      loading: true,
    });

    this.props.mutate({ variables: { password: model.password, token: this.props.token } })
      .then(({ data }) => {
        // redirect
      }).catch((error) => {
        console.log('there was an error sending the query', error);
      });
  }
  render() {
       //render jsx
  }
}

const CheckTokenQuery = gql`
  query CheckToken($token: String!) {
    checkToken(token: $token) { …

我正在使用react-dropzone和graphql-server-express-upload在GraphQL Apollo中上传所有图像.在我的客户端中,文件如下所示:

但是在服务器中,当我记录它时,它看起来像这样:

{ preview: 'blob:http://localhost:3000/c622b0bd-3f0d-4f52-91f4-7676c8534c59' }

我正在按照graphql-server-express-upload中的自述文件中的说明进行操作,但到目前为止还没有运气.如何获得完整图像？

我刚刚介绍了GraphQL,并决定在两个框架(Apollo和Relay)之间实现我的前端React Web应用程序.

我知道Relay是由Facebook建造的,而Apollo是由Meteor建造的.有没有人尝试过两者,你的经历如何？我想知道它们之间有什么区别,与Apollo相比,哪种GraphQL应用程序可以从使用Relay中获益更多.

我正在尝试在一个查询中执行3个唯一搜索.问题是我的搜索"过滤器"类型在模式中是必需的,但在前端它是可选的.如果在我的过滤器中提供了空值,那么我将得到graphql错误.

我想跳过搜索mainSearchData,firstComparisonSearchData或secondComparisonSearchData,具体取决于搜索过滤器是否包含数据.

我知道我可以使用该skip函数来忽略整个查询但是如何在查询的一部分中实现相同的功能呢？或者,我如何将这些作为单独的查询组成,但只执行一个请求？

const GROWTH_QUERY = gql`query aggregateQuery($mainFilter: filter!, $firstComparisonFilter: filter!, $secondComparisonFilter: filter! $interval: interval!) {
  mainSearchData: groupBy(filter: $mainFilter, first: 20, after: 0) {
    items: publicationDate(interval: $interval, minDocCount: 1, sort: DESC) {
      date
      count
    }
  }
  firstComparisonSearchData: groupBy(filter: $firstComparisonFilter, first: 20, after: 0) {
    items: publicationDate(interval: $interval, minDocCount: 1, sort: DESC) {
      date
      count
    }
  }
  secondComparisonSearchData: groupBy(filter: $secondComparisonFilter, first: 20, after: 0) {
    items: publicationDate(interval: $interval, minDocCount: 1, sort: DESC) {
      date
      count …

我正在尝试测试使用graphql的组件，但是当使用Apollo的MockProvider时，我始终无法获取数据，它每次都说loading = true。

一个完整的，极简的示例在这里

我尝试过的事情：

1. 在网上寻找（发现了类似的问题，但由于没有答案，我想我会用更多的信息来制作一个新的问题）
2. 在测试（export function Component）时尝试导出没有graphql的组件，但是在测试嵌套组件时不起作用
3. 尝试尽可能简化（其结果在示例中）

我正在尝试在客户端执行需要自定义输入类型的突变查询。目前它看起来像这样：

import { graphql } from 'react-apollo';
...
const graphQuery = graphql(gql`
  input UserSignUpInput {
    firstName: String!,
    lastName: String!,
    email: String!,
    password: String!
  }
  mutation userSignUp($input: UserSignUpInput!) {
    createUserByEmail(input: $input) {
      authToken
    }
  }`, {
  props: ({ mutate }) => ({
    signup: (firstName, lastName, email, password) =>
      mutate({ variables: { input: { firstName, lastName, email, password } } }),
  }),
});
...

但是我收到错误，我不允许在查询中定义输入类型。我的问题是：如何定义这些复杂的输入类型？我似乎无法向ApolloClient..

示例:https://codesandbox.io/s/j4mo8qpmrw

文档:https://www.apollographql.com/docs/link/links/state.html#default

TLDR:这是一个待办事项列表,@ client查询参数不会过滤掉列表.

这是查询,将$ id作为参数

  const GET_TODOS = gql`
    query todos($id: Int!) {
      todos(id: $id) @client {
        id
        text
      }
    }
  `;

查询在那里传递变量

<Query query={GET_TODOS} variables={{ id: 1 }}>

  /* Code */

</Query>

但默认解析器不使用该参数,您可以在上面的codesandbox.io示例中看到它.

文档说它应该有用,但我似乎无法弄清楚我错过了什么.提前致谢!

我们正在将graphql缓慢添加到我们的react项目中，并替换现有的redux集成。因此，我试图了解阿波罗中的缓存并看到了两件事。

1. apollo-cache-inmemory（https://www.npmjs.com/package/apollo-cache-inmemory）
2. apollo-link-state（https://github.com/apollographql/apollo-link-state）

我们有查询要在主页上调用应用程序列表，并且此应用程序列表将在其他页面上使用。所以我尝试的一个选项是在父容器中调用应用程序查询列表，并在子页面中使用client.readQuery，这样对graphql服务器的调用将仅在容器中发生，而在其他页面中它将发生从缓存中调用。但是我看到一些有关在类似情况下使用apollo-link-state的帖子。那么什么是最好的方法？什么时候使用apollo-cache-inmemory？什么时候使用apollo-link-state？

我想用钩子执行2个查询，其中第二个查询使用第一个查询中检索到的信息。例如：

const { data, error, loading } = useQuery(GET_DOGS);
const result2 = useQuery(GET_BREEDS, { variables: { dogId: data[0].id } });

现在，我使用某种状态并skip在第二个挂钩上设置了参数，但是我认为必须有一些更容易忽略的解决方案？

我在graphql查询中遇到了以上错误，我正在顺便起诉apollo-react，并使用Query组件呈现数据

这是我的代码

const GET_VEHICLE_CHECKS = gql`
query getVehicleChecks($uuid: String!) {
  tripDetails(uuid: $uuid){
    departmentAssigned{
      vehicleChecks{
        conditions{
          id
          name
          standard
          valueType
          spinnerItems
        }
      }
    }
  }

`;

这就是我的实际查询

{
  tripDetails(uuid: "c0e7233093b14afa96f39e2b70c047d8"){
    departmentAssigned{
      vehicleChecks{
        conditions{
          id
          name
          standard
          valueType
          spinnerItems
        }
      }
    }
    vehicleConditions{
      id
      condition{
        id
        standard
      }
      value
    }
  }
}

我尝试更改变量名称，但这没有用