在 Vue-apollo 中使用 gql-tag 构造查询字符串

Posted 2023-03-10

【中文标题】在 Vue-apollo 中使用 gql-tag 构造查询字符串

【英文标题】：Constructing query string with gql-tag in Vue-apollo

【发布时间】：2021-04-19 14:39:05

【问题描述】：

我相信可以使用 JS 动态构造 GraphQL 查询字符串，但我无法弄清楚语法。 我的 Vue 组件中有一个查询，如下所示：

  apollo: 
    metricsOee: 
      query: METRICS_OEE,
      loadingKey: 'loading',
      variables() 
        return 
          widgetType: this.data.name,
          page: 'dashboard',
          currentMetricDay: this.currentTime
        
      
    
  

我不想每次都从我的组件中传递 currentTime，而是在查询本身中计算它。我的尝试是这样的：

[![在此处输入图片描述][1]][1]

我理解gql``和JS插值不一样，但这是为了说明问题 [1]：https://i.stack.imgur.com/qwgpw.png

【问题讨论】：

不需要使用插值...只需使用下一个变量作为其他 2 个变量？只需定义$currentMetricDay 并输入第一个查询行

【参考方案1】：

您可能需要用双引号将 $currentMetricDay 括起来：

...
metricsOee: getMetricsOee(
currentMetricDay: "$currentMetricDay"
widgetType: $widgetType
page: $page
)
...

【讨论】：

哇，这很简单。非常感谢！