Я пытаюсь интегрировать платежный шлюз Stripe, используя реакцию laravel inertia. ниже приведен мой компонент и код моего контроллера. Когда я нажимаю кнопку «Выбрать план», я хочу, чтобы он выполнил полосовую оплату. Я предоставляю вам приветственный компонент, компонент ценовой карты и контроллер. пожалуйста, предоставьте мне лучшее решение
экспорт функции по умолчанию Добро пожаловать let PricingCard = ({id, name, цена, описание, продолжительность }) импортировать панель навигации из "@/Components/Wesite/Navbar"; импортировать Carousal из "@/Components/Wesite/Carousel"; импортировать карты из "@/Components/Wesite/Cards"; import { Link, Head, usePage } из "@inertiajs/react"; импортировать PricingCard из "@/Components/Wesite/Pricing"; импортировать FooterBrand из "@/Components/Wesite/Footer"; импортировать {useState} из «реагировать»; функция экспорта по умолчанию Welcome(реквизит) { const {изображение, членство} = usePage().props; const { class_3, class_4, class_5, телефон, сообщение, местоположение} = изображение; const [membershipCards, setMemberShipCards] = useState(членство); возвращаться ( Почему выбрали нас? РАСШИРЬТЕ СВОИ ПРЕДЕЛЫ ВПЕРЕД НАШ ПЛАН ВЫБЕРИТЕ СВОЙ ЦЕНОВОЙ ПЛАН {membershipCards.map((элемент, индекс) => ( ))}
333 Middle Winchendon Rd, Риндж, Нью-Хэмпшир 03461
125-711-811 125-668-886
Support.gymcenter@gmail.com ); } import { CardElement, useStripe, useElements } из "@stripe/react-stripe-js"; импортировать аксиомы из «аксиом»; импортировать {Карту} из "flowbite-реагировать"; импортировать {useState} из «реагировать»; let PricingCard = ({ id, имя, цена, описание, продолжительность }) => { константная полоса = useStripe(); константные элементы = useElements(); const [planId, setPlanId] = useState({ членство_план_ид: идентификатор, }); const handleSubscription = async () => { const { setupIntent, error } = awaitstripe.confirmCardSetup({ способ оплаты: { карта: elements.getElement(CardElement), Платежные реквизиты: { name: "Имя владельца карты", }, }, }); если (ошибка) { console.error(ошибка); } еще { const ответ = ждут axios.post("/member/buy-subscription", { метод_оплаты: setupIntent. метод_платежа, Price_id: id, // Это должно соответствовать идентификатору плана Stripe. }).then((ответ) => { console.log(ответ); }); } }; возвращаться ( {имя} $ {цена} /{duration} месяц {description Выбрать план
); }; экспортировать PricingCard по умолчанию;
