Snipcart добавить элемент через JS API - PullRequest
Новая
       39

Snipcart добавить элемент через JS API

2 голосов
/ 05 мая 2019

Я создаю очень маленький веб-сайт электронной коммерции для продажи настраиваемых ювелирных изделий, поэтому у меня есть графический конфигуратор, который позволяет вам создавать ювелирные изделия, а затем добавлять их в корзину. Продукт должен иметь настраиваемое поле в формате JSON, содержащее конфигурацию элемента. Я вижу, что Snipcart имеет data-item-custom{x} поля, но заполнен только выпадающими списками ... мне не подходит.

Как вы думаете, я справлюсь с этой ситуацией с помощью Snipcart? Могу ли я просто обновить через JS содержимое полей HTML data-item-? Или добавить товар в корзину через JS? 

addToCart({
 name: 'Bracelet 1',
 customField1: 'JSON HERE'
})

1 Ответ

1 голос
/ 07 мая 2019

Для Snipcart доступно Javascript API .

Это позволяет добавлять товар динамически, однако синтаксис для настраиваемых полей немного отличается. Пример из документа для Snipcart.api.items.add показывает, как использовать настраиваемые поля (для краткости удалены неиспользуемые поля): 

Snipcart.api.items.add({
    "id": "SMARTPHONE",
    "name": "Smartphone",
    "url": "/",
    "price": "399.00",
    "customFields": [{
        "name": "Memory size",
        "options": "16GB|32GB[+50.00]",
        "value": "32GB"
    }]
});

Таким образом, вместо упрощенной версии с customFieldX, вы можете передать массив в customFields. Раскрывающийся формат используется только если вы передаете options. Для вашего случая использования это станет: 

Snipcart.api.items.add({
    "id": "SMARTPHONE",
    "name": "Smartphone",
    "url": "/",
    "price": "399.00",
    "customFields": [{
        "name": "configuration",
        "value": "{\"option1\":\"value1\"}" //...
    }]
});

Однако заказчику показываются пользовательские поля, которые не были бы идеальными для показа им необработанных данных json. Для передачи скрытых данных вы можете вместо этого использовать metadata, который уже ожидает объект JSON: 

Snipcart.api.items.add({
    "id": "SMARTPHONE",
    "name": "Smartphone",
    "url": "/",
    "price": "399.00",
    "customFields": [{
    "metadata": {
        "configuration": "configuration data"
    }
});
...