Question

Shopify Storefront API examples在一个页面上显示一个App.js视图，其中列出了所有产品。在这些示例中，产品从此索引页面添加到购物车，并且没有产品详细信息页面。与示例不同，我想从产品索引中单击进入产品详细信息页面。

产品索引很容易。但是 alot 难以理解如何为每个产品创建页面。

似乎我不能在Shopify Storefront上使用带有变量的graphql查询。例如，这失败了：

query myQuery($id: ID!) { Product(id: $id) { id title } }

我正在使用nuxt和vue-apollo构建前端。

任何指针表示赞赏。

Answer 1

您提供的查询缺少您正在查询的实际变量值。

对GraphQL端点的HTTP请求的正文应如下所示：

query:"query myQuery($id: ID!) {
  Product(id: $id) {
    id
    title
  }
}"
variables:{id: "ce03707f-971e-4c64-853c-06a8c2e21448"}

编辑：Vue特定示例：

// Apollo-specific options
apollo: {
  // Query with parameters
  ping: {
    // gql query
    query: gql`query PingMessage($message: String!) {
      ping(message: $message)
    }`,
    // Static parameters
    variables: {
      message: 'Meow',
    },
  },
},

来自：https://akryum.github.io/vue-apollo/guide/apollo/queries.html#query-with-parameters

店面API：查询可变参数？

1 个答案: