标签: 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) { …

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

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

我在理解 ApollofetchMore方法时遇到问题。我是这个工具的新手，文档中的示例对我来说太复杂了。我在互联网上搜索，但找不到更多（当前）示例。你能帮我写一个无限加载数据的最简单的例子吗？我有这个代码：

const productInfo = gql`
  query {
    allProducts { 
      id
      name
      price
      category {
        name
      }
    }
  }`

const ProductsListData = graphql(productInfo)(ProductsList)

我想在每次点击“加载更多”按钮后获取 5 个产品和 5 个以上的产品。我理解这个想法 - 光标等，但我不知道如何实现这一点。（我正在使用反应）

我正在使用 Apollo 客户端进行 GraphQL 客户端集成。我添加了以下运行脚本，这是官方文档中建议的。

cd "${SRCROOT}/${TARGET_NAME}/GraphQL/Open"
$APOLLO_FRAMEWORK_PATH/check-and-run-apollo-codegen.sh generate $(find 
. -name '*.graphql') --schema schema.json 
 --output APIClient.swift

但是出现的问题是所有标量现在都以字符串形式出现。

例如：- 在登录时，如果我创建了电子邮件和密码的变更，我的架构将响应作为 JSON 返回，而创建的 APIClient 将响应显示为字符串（而不是 JSON）。

因此，收到了一个错误，上面写着

Apollo.GraphQLResultError(path: ["login", "response"], underlying: Apollo.JSONDecodingError.couldNotConvert

这是因为接收的是 String 而不是 JSON，并且字符串无法转换为所需的 JSON。

有没有人面临同样的问题？

我们可以使用 Query 和 Mutation 向服务器发出一些请求。在这些查询中，我们可以传递一些参数，并且在这两种情况下我们都会从服务器获得一些结果。唯一的必要区别是我们可以像“this.props.mutation”一样从我们的道具中调用变异，但它看起来像是一种语法糖，因为我们可以将我们的 HOC 包装在“withApollo”中，我们将收到“query”道具中的方法也是如此。那么这两种类型的请求之间的主要区别是什么？

我现在正在尝试Prisma和React Native.目前我正在尝试使用包_apollo-upload-client(https://github.com/jaydenseric/apollo-upload-client)将图像上传到我的数据库.但它并不是那么顺利.

目前我可以选择ImagePicker来自世博会的图像.然后我试图用Apollo客户端进行变异:

await this.props.mutate({
  variables: {
    name,
    description,
    price,
    image,
  },
});

但是我收到以下错误:

Network error: JSON Parse error: Unexpected identifier "POST"
- node_modules/apollo-client/bundle.umd.js:76:32 in ApolloError
- node_modules/apollo-client/bundle.umd.js:797:43 in error

我相信它来自以下代码:

const image = new ReactNativeFile({
  uri: imageUrl,
  type: 'image/png',
  name: 'i-am-a-name',
});

这与他们的示例几乎完全相同,https://github.com/jaydenseric/apollo-upload-client#react-native.

imageUrl来自我的州.当我在console.log时,image我得到以下内容:

ReactNativeFile {
  "name": "i-am-a-name",
  "type": "image/png",
  "uri": "file:///Users/martinnord/Library/Developer/CoreSimulator/Devices/4C297288-A876-4159-9CD7-41D75303D07F/data/Containers/Data/Application/8E899238-DE52-47BF-99E2-583717740E40/Library/Caches/ExponentExperienceData/%2540anonymous%252Fecommerce-app-e5eacce4-b22c-4ab9-9151-55cd82ba58bf/ImagePicker/771798A4-84F1-4130-AB37-9F382546AE47.png",
}

所以有些东西突然冒出来了.但我无法进一步,我希望我能得到一些人的提示.

我也没有包含后端的任何代码,因为我认为这个问题存在于前端.但如果有人想看看后端我可以更新问题,或者你可以看看这里:https://github.com/Martinnord/Ecommerce-server/tree/image_uploads.

非常感谢阅读!干杯.

更新

有人问服务器中的逻辑之后我决定将其过去:

Product.ts

// import shortid from 'shortid' …

我有一个名为deleteSong. 我想知道在突变通过后如何将多个查询传递到refetchQueries?

 this.props
  .deleteSong({
    variables: { id },
    refetchQueries: [{ query: fetchSongs }] //<-- I only know how to pass 1 query
  })
  .then(() => {})
  .catch(err => {
    this.setState({ err });
 });

我现在已经完全浪费了我的晚上试图解决这个问题，但即使经过多次搜索，我也无法回答。

我有我的服务器，它抓取我的“.graphql”文件文件夹并将它们合并成一个大文件，我将它与我的解析器一起传递到“makeExecutableSchema()”中，如下所示

        const folders      = fs.readdirSync(path.join(__dirname, './api'));
        const allResolvers = [];
        let typeDefs       = '';

        folders.forEach(folder => {
          if (folder !== 'directive') {
            typeDefs = typeDefs.concat(requireText(`./api/${folder}/${folder}.graphql`, require));
            const { resolver } = require(`./api/${folder}/${folder}.resolvers`);
            allResolvers.push(resolver);
          }
        });

        const resolvers = _.merge(allResolvers);
        return makeExecutableSchema({typeDefs, resolvers});

现在我不断收到错误

    Error: Schema must contain unique named types but contains multiple types named "Address".
        at invariant (C:\100hotwater\src\server\node_modules\graphql\jsutils\invariant.js:19:11)
        at typeMapReducer (C:\100hotwater\src\server\node_modules\graphql\type\schema.js:216:58)
        at Array.reduce (<anonymous>)
        at C:\100hotwater\src\server\node_modules\graphql\type\schema.js:237:36
        at Array.forEach (<anonymous>)
        at typeMapReducer (C:\100hotwater\src\server\node_modules\graphql\type\schema.js:232:51)
        at Array.reduce (<anonymous>)
        at new GraphQLSchema …

Amplify是否支持此处概述的离线功能：https : //docs.aws.amazon.com/appsync/latest/devguide/building-a-client-app-react.html#offline-settings

我应该这样设置吗？ https://aws.github.io/aws-amplify/media/api_guide#configuration-for-graphql-server

或者对于离线功能，我是否必须使用类似Apollo的功能？

这是我的graphql查询/突变。

我收到错误消息：GraphQLError：语法错误：Expected：，found {

我不知道其中哪一个是错误的。

import gql from 'graphql-tag';

export const CategoriesQuery = gql`
    query categoriesQuery(
        $id: ID!,
        $country: String!,
        $name: String!
    ) {
        sections(
            id: $id,
            country: $country,
            name: $description
        ) {
            id,
            createdBy,
            createdDate,
            lastUpdate,
            name
        }
    }
`;

export const ItemsQuery = gql`
    query itemsQuery(
        $id: ID!,
        $category: String!,
        $url: String!,
        $alias: String!,
        $name: String!
    ) {
        items(
            input {
                id: $id,
                category: $category,
                url: $url,
                alias: $alias,
                name: $name
            }
        ) {
            id,
            createdBy,
            createdDate,
            lastUpdate,
            name, …