在 react-apollo 中建模可选的过滤器参数

Question

我正在使用 react-apollo 访问网络应用程序中的 graphql。

我有一个类似这样的查询，它允许我过滤游戏时间表：

query($pagination:Int!, $divisionId:ID, $teamId:ID, $startDate:DateTime!, $endDate:DateTime!
){
 games: allGames (
 orderBy: date_ASC,
 first: $pagination,
 filter: {
   date_gte: $startDate,
   date_lte: $endDate,
   division: {id: $divisionId},
   OR: [
    {homeTeam: {id: $teamId} },
    {awayTeam: {id: $teamId} },
   ]
  }
){
 id
 .... more fields
}

每个请求都需要 startDate 和 endDate 变量，但不需要 teamId 和 divisionId。我想在初始请求中显示所有 teamIds 和 divisionIds，并允许根据需要过滤/向下钻取。

我想看看是否可以添加通配符 (*) 或类似的东西，但不确定是否可行。使用 graphql 突变，变量的 null 值允许我编写适用于多个用例的单个突变（部分更新和创建），但我无法弄清楚如何通过查询实现类似的功能。

我是否需要为每个筛选方案调用不同的查询（一个用于没有 divisionId 和 teamId，一个仅用于 divisionId，一个仅用于 teamId，以及divisionId 和 teamId 都有一个吗？fragments 可以帮助我以更少的开销实现这一目标吗（因为最后一句话让这个过程看起来有点太麻烦/不干）。

或者我将 division 和 id 切换为 division_in 和 id_in 并传递给它们（有点大）数组，其中包含 [=18= 的所有可能值] 和 teamdIds 作为初始道具？

Answer 1

所以事实证明你实际上将整个过滤器存储为一个变量（这非常棒）。

这是更新后的查询：

query( $first:Int!, $skip:Int!, $gameFilter:GameFilter! ){
  games: allGames (
    orderBy: date_ASC,
    first: $first,
    skip: $skip,
    filter: $gameFilter
  ){
    id
    ... more fields
   }
}

以及对应的HOC：

export default graphql(gamesQuery, {
  options: props => ({
    return { variables: {props.gameFilter}
  });
})(GamesPage);

给这些家伙的小费：

在 react-apollo 中建模可选的过滤器参数

Modeling optional filter params in react-apollo

reactjs

graphql

apollo

react-apollo