标签: apollo

变量与模板文字插值

您是否应该${foo}在Apollo查询中使用而不是variables: {foo: foo}

在此输入图像描述

javascript apollo

4
推荐指数
1
解决办法
325
查看次数

使用 GraphQL 的 Angular2 服务和路由解析器

我正在尝试通过 Apollo-Client 将 Angular2 与 GraphQL 一起使用。我遵循了文档,一切似乎都正常。但是文档只解释了如何从组件连接到 GraphQL。没有关于如何使用服务进行服务器调用的信息,或者对我来说更重要的是如何将 Angular2 路由解析器与 Apollo 查询或 watchQuery 一起使用。

我找到了一个关于如何使用 Apollo 查询将此逻辑移动到服务的解决方案,它似乎有效,但是我无法使用 Apollo watchQuery 方法让它工作。有人对可能的解决方案有任何想法吗?

或者我将 GraphQL 调用移动到服务和使用解析器的方法是错误的,GraphQL 逻辑应该简单地留在组件中?

apollo graphql apollostack angular

4
推荐指数
1
解决办法
870
查看次数

未捕获的错误:react-apollo仅根据HOC支持查询,订阅或突变

我正在尝试使用封装Chat两个查询和一个突变的组件compose

但是,控制台中仍然出现以下错误:

未捕获的错误: react-apollo每个HOC仅支持查询,订阅或突变。[object Object]有2个查询,0个订阅和0个突变。您可以使用' compose'将多种操作类型连接到一个组件

这是我的查询和导出语句:

// this query seems to cause the issue
const findConversations = gql`
    query allConversations($customerId: ID!) {
        allConversations(filter: {
          customerId: $customerId
        })
    } {
        id
    }
`

const createMessage = gql`
    mutation createMessage($text: String!, $conversationId: ID!) {
        createMessage(text: $text, conversationId: $conversationId) {
            id
            text
        }
    }
`

const allMessages = gql`
    query allMessages($conversationId: ID!) {
        allMessages(filter: {
        conversation: {
        id: $conversationId
        }
        })
        {
            text
            createdAt …
Run Code Online (Sandbox Code Playgroud)

javascript apollo reactjs graphql react-apollo

4
推荐指数
1
解决办法
1289
查看次数

Apollo graphql:变异后的writeQuery不会触发flatlist的重新渲染

我在平面列表中有以下按钮触发graphql变异,在变异后我执行writeQuery来更新本地缓存(存储).在更新函数f中,我正在更新缓存中的两个字段.基本上当用户触摸类似按钮时,我将类似的布尔值变为true,并将该帖子的类似计数更新为+1(类似于twitter).但是,平面列表中的组件不会更新.我甚至打印出了apollo商店/缓存,我看到值得到了更新.为什么在缓存写入后平面列表不能重新渲染?

   render() {


 const { posts, isFetching, lastUpdated, location, navigation, data, likeMutation, username, distancePointLatitude, distancePointLongitude, searchPointLatitude, searchPointLongitude } = this.props


 <FlatList
  data={data.near}
  style={styles.scrollViewContent}
  extraData={this.props.store}
  //renderSeparator={(sectionId, rowId) => <View key={rowId} style={styles.separator} />}
  showsVerticalScrollIndicator={false}
  onRefresh={this._onRefresh.bind(this)}
  refreshing={this.state.refreshing}
  keyExtractor={this._keyExtractor}
  renderItem={({item, index}) => item.posts.length != 0 && <ListItem>

{item.posts[0].userInteraction.userLike ? <Icon name='md-heart' style={{ color: 'crimson',fontSize: 28}} /> 
          : <Icon name='heart' style={{ fontSize: 26}} 

          onPress={() => likeMutation({ variables: { elementId: item.posts[0].postId, userId: username  },

            update: (store, { data: { addLike } }) => {
              // Read …
Run Code Online (Sandbox Code Playgroud)

apollo graphql react-native apollo-client

4
推荐指数
1
解决办法
1948
查看次数

GraphQL:成功突变后如何发出警告?

假设我有一个createPost插入新帖子的变异。在典型的应用中,该突变可以:

  • 成功,返回Post
  • 失败,抛出一个错误(我使用apollo-errors处理)。

我要实现的是一个中间场景,在该场景中,突变成功(返回Post);而且还会以某种方式向用户返回警告(例如Your post is similar to post XYZ,类似的警告)。

实现此目的的一个好的GraphQL模式是什么?warningPost类型中添加字段似乎有点怪异,但是我又不确定如何在相同的突变中同时返回a Post和a Warning?有任何想法吗?

(请注意,我以这种情况为例,我对返回额外的突变后数据的通用模式感兴趣,而不是专门查找类似的帖子)

apollo graphql

4
推荐指数
1
解决办法
642
查看次数

如何在Apollo中为refetchQueries传递变量

我不确定最佳做法是variables采用refetchQueries期权。在下面的示例中,变量为{id: this.props.item.id}

但是传递由于未实例化而this.props.item.id返回错误,MyComponent因此this.props未定义。

function mapStateToProps(state) {
  return {
    item: state.item
  };
}

MyComponent = connect(mapStateToProps, matchDispatchToProps)(
  MyComponent
);

MyComponent = graphql(createItemImage, {
  name: "createItemImage",
  options: {
    refetchQueries: [
      {
        query: getEntity,
        variables: { id: this.props.item.id }
      }
    ]
  }
  })(MyComponent);
Run Code Online (Sandbox Code Playgroud)

id值仅在运行时可用。

提前致谢!

apollo reactjs

4
推荐指数
2
解决办法
4418
查看次数

如何从阿波罗缓存中获取更新的数据

Apollo客户端是否有类似mapStateToProps(Redux)之类的东西?

假设我有一个组件,查询后我知道缓存中有数据,因此我执行以下操作:

    class Container extends React.Component {
      ...
      ...
      render() {
        const notes = this.props.client.readFragment(NOTES_FRAGMENT)
        // notes has everything I need
        return (<Child notes={notes} />);
      }

    }
    export default WithApollo(Container);
Run Code Online (Sandbox Code Playgroud)

但是,当我有一个名为mutation并进行更新的同级组件时,该<Child />组件的道具永远不会得到更新。

class AnotherContainer extends React.Component {
   render() {
     return(
       <Mutation
          mutation={UPDATE_NOTE}
          update={(cache, {data: {updateNote}}) =? {
            const list = cache.readFragment({
              fragment: NOTES_FRAGMENT
            })
            // manipulate list
            cache.writeFragment({fragment:NOTES_FRAGMENT, data })
          }
        }
     )
   }
}
Run Code Online (Sandbox Code Playgroud)

所以我的问题是,<Child />每当我执行writeFragment时如何更新组件的道具?是否有诸如mapStateToProps之类的东西可以将notes道具“连接” 到缓存,所以无论何时更新,都会触发React生命周期?

apollo reactjs graphql redux react-apollo

4
推荐指数
1
解决办法
1769
查看次数

如何在apollo客户端中将Mutations链接在一起

我有一堆信息存储在我的状态中,我需要使用突变传递给我的graphQL服务器,但是我需要在调用下一个突变之前使用每个突变的结果,因为我需要:

  • 在我的数据库中创建一个新对象
  • 使用为该对象生成的id来创建另一个对象
  • 修改原始对象以存储第二个对象生成的id

我注意到apollo Mutation组件有一个onCompleted回调,但我不知道如何使用这个回调来触发另一个突变或者是否正确解决我的问题.我还研究了将我的突变配对以立即发送它们,但似乎也不是解决方案.任何帮助,将不胜感激

apollo reactjs graphql react-apollo apollo-client

4
推荐指数
1
解决办法
2191
查看次数

如何修复iOS 12 Safari Cors预检错误?

我正在尝试更好地理解COR,因为我们的网络应用程序的几个用户抱怨,因为他们升级到iOS 12他们正在接收预检错误.

Web检查员的错误

[Error] Preflight response is not successful
[Error] Fetch API cannot load https://www.api.com due to access control checks.
[Error] Failed to load resource: Preflight response is not successful (v4, line 0)
Run Code Online (Sandbox Code Playgroud)

客户端应用程序是Apollo的React应用程序.它使用Apache HTTPD和Express JS通过HTTPS调用服务器.

在所有其他浏览器上一切正常,这与iOS 12隔离.

奇怪的是,当我浏览HTTPD访问日志时,我看不到任何预检电话.当我尝试直接点击服务器时(在iOS 12上),我在日志中看到了预检OPTIONS请求和POST.但是当通过Web应用程序调用服务器时,COR的预检失败了.

在快递应用程序中,我还注销了所有请求,但它也没有出现.

在HTTPD我有设置

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS
Run Code Online (Sandbox Code Playgroud)

在表达我有同样的事情.

有任何想法吗?!

cors ios express apollo ios12

4
推荐指数
2
解决办法
2515
查看次数

Apollo服务器-关于缓存/数据源选项的困惑

docs(https://www.apollographql.com/docs/apollo-server/features/data-sources.html#Using-Memcached-Redis-as-a-cache-storage-backend)显示如下代码:

const { RedisCache } = require('apollo-server-cache-redis');

const server = new ApolloServer({
  typeDefs,
  resolvers,
  cache: new RedisCache({
    host: 'redis-server',
    // Options are passed through to the Redis client
  }),
  dataSources: () => ({
    moviesAPI: new MoviesAPI(),
  }),
});
Run Code Online (Sandbox Code Playgroud)

我想知道如何使用该cache密钥,因为考虑到缓存实际上是自定义实现的MoviesAPI(),然后通过来使用context.dataSources.moviesAPI.someFunc()。例如,假设我想为SQL数据库实现自己的缓存。看起来像

  cache: new RedisCache({
    host: 'redis-server',
  }),
  dataSources: () => ({
    SQL: new SQLCache(),
  }),
});
Run Code Online (Sandbox Code Playgroud)

在哪里SQLCache有我自己的功能连接到RedisCache类似:

  getCached(id, query, ttl) {
    const cacheKey = `sqlcache:${id}`;

    return redisCache.get(cacheKey).then(entry => {
      if …
Run Code Online (Sandbox Code Playgroud)

apollo apollo-server apollostack apollo-client

4
推荐指数
1
解决办法
1858
查看次数