Question

我是GraphQL的新手。

我想做的是在文本输入上的每个onBlur事件上调用GraphQL服务器。

问题是：

呼叫成功只进行一次。
在第二次通话中，我收到此错误：

ERROR Error: Apollo has been already created.

这可能是非常明显的，但我无法找到解决方案。

有没有办法在连续几次onBlur次事件中成功进行新的graphql调用？

onBlurZIP(zip) {
    const zipQuery = gql`
      query {
        getAddressByPostalCode(postalCode: "${zip}") {
            country
            city
            street
            streettype
            state
            stateInitials
            quarter
        }
      }
    `;

    const httpLink = createHttpLink({
      uri: environment.endpoint
    });

    const link = setContext((_, { headers }) => {
      return {
        headers: {
          // headers object...
        }
      }
    });

    this._apollo.create({
      link: link.concat(httpLink),
      cache: new InMemoryCache()
    });

    this.querySubscription = this._apollo.watchQuery<any>({
      query: zipQuery,
      variables: { zip },
      fetchPolicy: 'network-only'
    })
    .valueChanges
    .subscribe(
      res => {
        // do stuff...
      },

      err => console.log(err)
    );
  }

HTML：

<input formControlName="zip" (blur)="onBlurZIP($event.target.value)" type="text" class="form-control" name="zip" id="zip" required>

Answer 1

Apollo客户端实例必须是单例。您需要在应用程序中定义一次，然后使用<ApolloProvider>将其传递给组件。您可以参考react-apollo文档：https://www.apollographql.com/docs/react/essentials/get-started.html。

您的代码抛出错误，因为您在每个onBlur事件上创建了apollo客户端的实例。

修改

在angular.js中初始化apollo客户端的相关文档：https://www.apollographql.com/docs/angular/basics/setup.html

错误：Apollo已经创建

1 个答案: