Error: Apollo has been already created
Error: Apollo has been already created
我是 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>
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
我是 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>
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