微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

amp-list 和 amp-mustache 使用 WooCommerce API JSON 输出产品

如何解决amp-list 和 amp-mustache 使用 WooCommerce API JSON 输出产品

请帮帮我!我在 amp-list 和 amp-mustache 的帮助下无法列出我的 WooCommerce 产品。我无法解决问题,也无法解决问题。

我正在尝试读取 WooCommerce API 提供的 JSON 数据并将这些数据放入 amp-mustache 模板中。想象一下产品档案......

这是我的 HTML/AMP 代码

<amp-list
    xssi-prefix="["
    width="auto" 
    height="300" 
    layout="responsive" 
    credentials="include"
    src="https://huemanic.cc/wp-json/wc/v2/products/?consumer_key=ck_0d58c6648967903def5ff11b81c8d23785b5bb6d&consumer_secret=cs_cd7a7e2ff58ddbe4a68cf6f56eb39ed543410814"
    binding="no"
    data-amp-replace="RANDOM"
    items="id"
    >

    <template type="amp-mustache">

        <div class="name">{{name}}</div>
        <div class="id">{{id}}</div>
        <div class="price">{{price}}</div>

    </template>
</amp-list>

以及我用作 src 的 JSON 数据:

[
    {
        "id": 1441,"name": "Produkt","slug": "produkt-3","permalink": "https://huemanic.cc/produkt/produkt-3/","date_created": "2021-07-31T19:27:08","date_created_gmt": "2021-07-31T19:27:08","date_modified": "2021-07-31T19:27:08","date_modified_gmt": "2021-07-31T19:27:08","type": "simple","status": "publish","featured": false,"catalog_visibility": "visible","description": "","short_description": "","sku": "","price": "","regular_price": "","sale_price": "","date_on_sale_from": null,"date_on_sale_from_gmt": null,"date_on_sale_to": null,"date_on_sale_to_gmt": null,"on_sale": false,"purchasable": false,"total_sales": 0,"virtual": false,"downloadable": false,"downloads": [],"download_limit": -1,"download_expiry": -1,"external_url": "","button_text": "","tax_status": "taxable","tax_class": "","manage_stock": false,"stock_quantity": null,"in_stock": true,"backorders": "no","backorders_allowed": false,"backordered": false,"sold_individually": false,"weight": "","dimensions": {
            "length": "","width": "","height": ""
        },"shipping_required": true,"shipping_taxable": true,"shipping_class": "","shipping_class_id": 0,"reviews_allowed": true,"average_rating": "0.00","rating_count": 0,"upsell_ids": [],"cross_sell_ids": [],"parent_id": 0,"purchase_note": "","categories": [
            {
                "id": 16,"name": "Unkategorisiert","slug": "unkategorisiert"
            }
        ],"tags": [],"images": [
            {
                "id": 0,"date_created": "2021-08-01T11:15:34","date_created_gmt": "2021-08-01T11:15:34","date_modified": "2021-08-01T11:15:34","date_modified_gmt": "2021-08-01T11:15:34","src": "https://huemanic.cc/wp-content/uploads/woocommerce-placeholder-150x150.png","name": "Platzhalter","alt": "Platzhalter","position": 0
            }
        ],"attributes": [],"default_attributes": [],"variations": [],"grouped_products": [],"menu_order": 0,"price_html": "","related_ids": [
            1432,250,1435
        ],"Meta_data": [
            {
                "id": 1095,"key": "inline_featured_image","value": "0"
            }
        ],"amp_enabled": true,"_links": {
            "self": [
                {
                    "href": "https://huemanic.cc/wp-json/wc/v2/products/1441"
                }
            ],"collection": [
                {
                    "href": "https://huemanic.cc/wp-json/wc/v2/products"
                }
            ]
        }
    }…

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。