watchQuery（Angular-Apollo）的高速缓存管理

我使用Apollo和Angular 2合并分页，预取和重新获取数据的问题。我在应用程序中的行为是，服务器之间的数据永远不会有任何区别和客户。我想通过在菜单中预取数据并在每个隐藏内容的组件中有一个微调器/加载屏幕来减少用户的加载时间，直到数据被提取。如果一个组件已经被访问过了，我想触发一个重新读取而不是预取onmouseover，以便客户端匹配服务器。watchQuery（Angular-Apollo）的高速缓存管理

今天，如果我导航到一个组件并分页到例如显示该组数据的第三页，然后导航到另一个组件，然后又返回到第一个组件（在获取新数据之前完成）我从第三页获取缓存的数据，触发微调器隐藏，并在订阅获得“正确”数据之前，显示错误的数据集一秒/几秒。

我的问题是：有什么方法可以清除/控制特定查询/ watchQuery的缓存，这样我总是肯定不会在客户端显示缓存数据？

来源

2017-02-16 Patrik Nilsson

是的，你可以通过fetchPolicy选项watchQuery：

{ fetchPolicy: 'cache-first' }：这是默认获取阿波罗客户端使用指定策略时不获取政策。首先它会尝试从缓存中完成查询。只有当缓存查找失败时才会将查询发送到服务器。
{ fetchPol-icy: 'cache-only' }：使用此选项，Apollo客户端将尝试仅从缓存中完成查询。如果不是所有数据都在缓存中可用，则会引发错误。这相当于前noFetch。
{ fetchPolicy: 'network-only' }：使用此选项，Apollo Client将跳过缓存并直接将查询发送到服务器。这相当于以前的forceFetch。
{ fetchPolicy: 'cache-and-network' }：使用此选项，Apollo Client将查询服务器，但在服务器请求未决时从缓存中返回数据，并在服务器响应返回时稍后更新结果。

来源

2017-07-11 19:49:46

你可以做这样一个例子？ – Stefano

下面是使用阿波罗角由@Eitan Frailich描述一个例子：

import { ApolloModule, Apollo } from 'apollo-angular'; 
import { HttpLinkModule, HttpLink } from 'apollo-angular-link-http'; 
import { InMemoryCache } from 'apollo-cache-inmemory'; 

class AppModule { 
    constructor(apollo: Apollo, httpLink: HttpLink) { 
     apollo.create({ 
      link: httpLink.create(), 
      cache: new InMemoryCache(), 
      defaultOptions: { 
      watchQuery: { 
       fetchPolicy: 'cache-and-network', 
       errorPolicy: 'ignore', 
      }, 
      query: { 
       fetchPolicy: 'network-only', 
       errorPolicy: 'all', 
      }, 
      mutate: { 
       errorPolicy: 'all' 
      } 
     } 
     }); 
    } 
}

来源

2017-12-06 22:10:20

watchQuery（Angular-Apollo）的高速缓存管理

回答

相关问题