0

我正在使用 vue-apollo + vue-property-decorator。我可以像这样很好地运行查询：

  get apollo () {
    return {
      rc_tags: {
        query: gql`{ <body of query> }`
      }
    }
  }

但是，如果我尝试使用组件的属性进行查询，例如来自文件

  MYQUERY = gql`{ <body of query> }`


  get apollo () {
    return {
      rc_tags: {
        query: MYQUERY
      }
    }
  }

然后我得到错误：

Invariant Violation: Expecting a parsed GraphQL document. 
Perhaps you need to wrap the query string in a "gql" tag?

如果我像上面的示例那样从另一个文件导入 MYQUERY ，或者它是本地组件的属性，则同样的错误并不重要。我可以将鼠标悬停在 MYQUERY 上并得到一个 TypeScript 提示，它是一个 DocumentNode，但无论我做什么，如果不将完整的模板文字放入实际get apollo ()函数中，我都无法让它工作。

4

1 回答 1

0

我很困惑为什么将相同的 gql 查询作为组件的属性与内联定义它有什么不同，直到我意识到get apollo()在组件被创建（）之前运行，更不用说挂载（）。

这意味着此时组件上​​的所有数据属性都是未定义的，如果 MYQUERY 依赖于这些属性，它也将是未定义的，这就是 gql 抱怨的原因。

我试图引用组件属性的原因是评估要运行的“哪个”查询。如果您想做类似的事情，您需要注意您只评估在创建内部组件之前可用的数据。

于 2020-03-08T02:20:32.583 回答