javascript - JS / GraphQL 视图 - BigCommerce 主 SKU

Question

使用把手将 BigCommerce 的主 SKU 输出到前端视图的最佳方式是什么？

我使用过 GraphQL，但响应太慢而无法使用，因为它确实需要可以在渲染时输出。任何想法，将不胜感激。

GraphQL 代码

        <script type="text/javascript">
            fetch('/graphql', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'Authorization': 'Bearer {{ settings.storefront_api.token }}'
                },
                body: JSON.stringify({query: `
                    query {
                        site {
                            product(entityId: {{ product.id }}) {
                                sku
                            }
                        }
                    }
                `})
            }).then(function(response) {
                return response.json();
            }).then(function(response) {
                console.log(response.data.site.product.sku);
            });
        </script>

标签： javascriptgraphqlhandlebars.jsbigcommercegraphql-js

Answer 1

如果您在产品页面上：

{{product.sku}}

如果您在类别页面上：

{{#each products}}
   {{sku}
{{/each}}

您可以调试每个页面可用的上下文以了解 Stencil CLI 中可用的数据：

https://developer.bigcommerce.com/theme-objects#viewing-a-pages-context