Question

在突变后重新获取查询时，我遇到了一个问题。如果查询没有参数那没关系，但是如果查询有多个参数，并且不同的页面使用不同的参数。例如，GET_ITEMS查询接受参数：userId，companyId，categoryId。我如何对Apollo说要使用任何参数组合重新获取所有这些查询？

Answer 1

看来我现在无法用Apollo Client做到。因此，我必须保存所有页面上所有GET_ITEMS调用的参数，然后将保存的参数转移到refetchQueries突变方法。结果是这样的：

ItemsContext.js

const ItemsContext = React.createContext({
  cachedQueryVars: [],
});

ItemsList.js

...
render() {
...
return <ItemsContext.Consumer>{({cachedQueryVars}) => {
       cachedQueryVars.push(variables);
       return <Query query={GET_ITEMS} variables={variables} >
...

ItemEdit.js

...
render() {
...
return <ItemsContext.Consumer>{({cachedQueryVars}) => 
              <Mutation mutation={UPDATE_ITEM_MUTATION}
                  refetchQueries={({data}) => this.handleRefetchQueries(data.updateItem, cachedQueryVars)}
...
}

handleRefetchQueries(newItem, cachedItemsQueryVars) {
  let result = [];
  let filtered = null;

  if(this.state.oldCategoryId != newItem.category.id) {
    filtered = cachedItemsQueryVars.filter(v => v.categoryId == this.state.oldCategoryId);
    result = this.concatItemQueryVars(result, filtered);
    filtered = cachedItemsQueryVars.filter(v => v.categoryId == newItem.category.id);
    result = this.concatItemQueryVars(result, filtered);
  }
  if(this.state.oldCompanyId != newItem.company.id) {
    filtered = cachedItemsQueryVars.filter(v => v.companyId == this.state.oldCompanyId);
    result = this.concatItemQueryVars(result, filtered);
    filtered = cachedItemsQueryVars.filter(v => v.companyId == newItem.company.id);
    result = this.concatItemQueryVars(result, filtered);
  }
  ...

  return result;
}

concatItemQueryVars(result, filtered) {
  return result.concat(filtered.map(v => ({
    query: GET_ITEMS,
    variables: v
  })));
}

使用任何参数组合重新查询

1 个答案: