首先，我总是喜欢发布可运行的示例，但是由于这是一个js和服务器端在shopify上呈现的liquid的混合体，我不能得到一个运行的示例。
在shopify中，可以像{{ product }}一样从产品模板中访问product对象。
购物车对象具有items属性，该属性是购物车中所有项目的数组。购物车中的每个item对象都不同于product对象。product对象具有变量列表，而购物车item对象没有。
这样做的目的是为了能够编辑购物车中项目的大小。
我的问题是，你怎么才能得到所有的链接变量呢？你必须移动到产品，得到一个所有变量的列表，从变量到product_id。
这很棘手，因为当你得到cart对象的fetch响应时，你会得到cart中每个item的一个product_id，但是除非你在产品页面上，否则你不能得到产品对象。
为了帮助形象化购物车，请看下面的内容：

{
  items: [
    {
      handle: 'product-handle',
      product_id: 123,
      variant_title: 'product variant'
    }
  ]
}

需要完成的是：

{
  items: [
    {
      handle: 'product-handle',
      product_id: 123,
      /**
       * to get this you need first access to the product object from the product 
       * template. You could convert the product to json with a filter
       * e.g. const product = {{ product | json }} but you don't have the 
       * opportunity to be on the product template each time you edit a cart item
      */
      variants: [
        { color: 'white', size: 's' },
        { color: 'white', size: 'm' }
      ]
    }
  ]
}