如何确定产品在条形结帐中出现的顺序/顺序

Question

在stripe.redirectToCheckout()中，我们使用lineItems来列出要呈现的产品；这些产品是在Stripe中配置的项(无论是测试模式还是生产模式)。

我似乎无法找到控制产品呈现顺序的方法：

如果我更改screenshot).

• No数组元素在lineItems中的顺序(参见Stripe仪表板中的

• 明显的工具，以重新订购产品，例如通过“向上/向下”或拖放卡)，则不会发生更改。

我曾想过试图通过归档和重新创建产品来改变订单，但这似乎是一个黑客，即使对2-3个产品来说也是不可持续的。当商店想要A/B测试产品的订购，或者当他们有大量的产品时，商店会做什么？

这是一个很难解决的问题，因为“订单/排序”、“排列”、“序列”都有模糊的含义……！

​

​

Answer 1

使用lineItems数组对产品进行排序/排序会使工作(请参阅OP上的@v3nkman注释)，但在我的示例中，特定呈现的页面并没有连接到checkout.js上的该数组；而是由Products.js上的GraphQL字符串管理，我通过向其中添加sort字段来解决这个问题，如下所示：

const Products = () => {
  return (
    <StaticQuery
      query={graphql`
        query ProductPrices {
          prices: allStripePrice(
            filter: { active: { eq: true } }
            sort: { fields: [created], order: ASC } // new line
          ) {
            edges {
              node {
                id
                active
                currency
                unit_amount
                product {
                  id
                  name
                  images
                  description
                }
              }
            }
          }
        }
      `}
      render={({ prices }) => {
        // Group prices by product
        const products = {}
        for (const { node: price } of prices.edges) {
          const product = price.product
          if (!products[product.id]) {
            products[product.id] = product
            products[product.id].prices = []
          }
          products[product.id].prices.push(price)
        }
        return (
          <div style={containerStyles}>
            {Object.keys(products).map(key => (
              <ProductCard key={products[key].id} product={products[key]} />
            ))}
          </div>
        )
      }}
    />
  )
}