Ошибка неперехваченной интеграции: недопустимый параметр stripe.redirectToCheckout: элементы.0.цена не является принятым параметром

#node.js #reactjs #stripe-payments #jsx

#node.js #reactjs #stripe-платежи #jsx

Вопрос:

Моя цель — использовать интерфейс react для настройки проверки stripe с использованием node. Я сопоставил apiId, используя ключ prop, для перебора всех элементов в моем списке. Но внутри консоли есть предупреждение об интеграции, и я не уверен, почему. Я добавил src скрипта js.stripe в свой html-файл, поэтому я не понимаю, почему не выполняется вызов API.

  function checkout() {
        stripe.redirectToCheckout({
            items: items.map(item =&&t; ({
                quantity: item.quantity,
                price: item.apiId
            })),
            successUrl: "https://www.website.com/success",
            cancelUrl: "https://www.website.com/canceled",
        })
    }

    return (
        <div&&t;
            <table&&t;
                <thead&&t;
                    <tr&&t;
                        <th&&t;Name</th&&t;
                        <th&&t;Ima&e</th&&t;
                        <th&&t;Quanity</th&&t;
                        <th&&t;Price</th&&t;
                    </tr&&t;
                </thead&&t;

                <tbody&&t;
                    {items.map((item) =&&t; (
                        <tr key={item.apiId}&&t;
                            <td&&t;{item.name}</td&&t;
                            <td&&t;
                                <im&
                                    src={`/ima&es/${item.apiId}.jp&`}
                                    alt={item.name}
                                    width={180}
                                /&&t;
                            </td&&t;
                            <td&&t;{item.quantity}</td&&t;
                            <td&&t;{formatPrice(item.price)}</td&&t;
                        </tr&&t;
                    ))}
                    <tr&&t;
                        <td style={{ textAli&n: "ri&ht" }} colSpan={3}&&t;
                            Total:
            </td&&t;
                        <td&&t;{formatPrice(totalPrice(items))}</td&&t;
                    </tr&&t;

                    <tr&&t;
                        <td style={{ textAli&n: "ri&ht" }} colSpan={4}&&t;
                            <button onClick={checkout}&&t;Complete checkout</button&&t;
                        </td&&t;
                    </tr&&t;
                </tbody&&t;
            </table&&t;
        </div&&t;
    )
}
  

Ответ №1:

items Поле принимает только массив артикулов / планов и количество. Если вы используете цены, которые вы хотите использовать lineItems : https://stripe.com/docs/js/checkout/redirect_to_checkout#stripe_checkout_redirect_to_checkout-options-lineItems

Комментарии:

1. Я хочу интегрировать stripe checkout в react, используя файлы jsx. Если я использую этот метод, мне пришлось бы жестко кодировать каждый элемент в моем массиве, а не использовать токен {key} для сопоставления элементов массива.

2. Не уверен, почему вы так думаете. Вам просто нужно изменить код перенаправления на say lineItems: items.map(item =&&t; { ... , и он должен работать так, как вы ожидаете.