我目前在一个电子商务网站上工作。为此，我使用nextJS，commerceJS和条纹。我现在有一个工作支付卡。我还想添加bancontact支付方式。我不知道如何做到这一点。我找不到关于它在互联网上的东西。
以下是我的信用卡支付：

import { loadStripe } from "@stripe/stripe-js";
import {
  Elements,
  CardElement,
  ElementsConsumer,
} from "@stripe/react-stripe-js";
import { Stripe, StripeElements } from "@stripe/stripe-js/types/stripe-js";
import { useCheckout } from "@/context/checkout";
import commerce from "@/lib/commerce";

const stripePromise = loadStripe(
  process.env.NEXT_PUBLIC_STRIPE_PUBLIC_KEY as string
);

interface PaymentSectionProps {}

export const PaymentSection: React.FC<PaymentSectionProps> = ({}) => {
  const { token, shippingData, handleCaptureCheckout, order } = useCheckout();

  const handleSubmit = async (
    event: React.FormEvent<HTMLFormElement>,
    elements: StripeElements | null,
    stripe: Stripe | null
  ) => {
    event.preventDefault();

    if (!stripe || !elements) return;

    const cardElement = elements.getElement(CardElement);

    //@ts-ignore
    const { error, paymentMethod } = await stripe.createPaymentMethod({
      type: "card",
      card: cardElement,
    });

    if (error) {
      console.error("error", error);
    } else {
      console.log(token);
      if (shippingData && token) {
        console.log("Here");

        const orderData = {
          line_items: token.line_items,
          customer: {
            firstname: shippingData.customer.firstname,
            lastname: shippingData.customer.lastname,
            email: shippingData.customer.email,
          },
          shipping: {
            name: shippingData.shipping.name,
            street: shippingData.shipping.street,
            town_city: shippingData.shipping.town_city,
            county_state: shippingData.shipping.county_state,
            postal_zip_code: shippingData.shipping.postal_zip_code,
            country: shippingData.shipping.country,
          },
          fulfillment: { shipping_method: "fadfda" },
          payment: {
            gateway: "stripe",
            stripe: {
              payment_method_id: paymentMethod.id,
            },
          },
        };

        handleCaptureCheckout(token.id, orderData);
        console.log(order);
      }
    }
  };

  return (
    <section className="w-full h-screen flex justify-center items-center">
      <Elements stripe={stripePromise}>
        <ElementsConsumer>
          {({ elements, stripe }) => (
            <form
              onSubmit={(e) => handleSubmit(e, elements, stripe)}
              className="w-full"
            >
              <CardElement />
              <br /> <br />
              <div style={{ display: "flex", justifyContent: "space-between" }}>
                <button type="submit" disabled={!stripe} color="primary">
                  Pay
                </button>
              </div>
            </form>
          )}
        </ElementsConsumer>
      </Elements>
    </section>
  );
};

在stripe文档页面上，我发现了一些关于paymentIntents的内容。这难道不是一个正确的方法吗？