I am working on a booking project using react native having its backend in nodejs express trying to implement webcheckout using stripe. already have the model set up in the backend server, having difficulty calling the stripe online checkout.

redirectToCheckout not working on react native. also having difficulty using react-native-stripe-checkout-webview.

couple of months new to react native.

here is what have tried. cannot get the view on tab screen when click 0n pay button but can see my data when console.log

import StripeCheckout from 'react-native-stripe-checkout-webview';

const BookTour = async _id => {

        // 1) get checkout session from api

        const booking = await axios(`/api/v1/bookings/checkout-session/${_id}`)
        const data = await booking;
        console.log(data)
        // 2) create checkout 

            // await stripe.redirectToCheckout({
            //     sessionId: data.session.id
            // });

        return (
            <StripeCheckout
            stripePublicKey='pk_test_51J5UwGJyQ6fuwVkq------'
            checkoutSessionInput={{
            sessionId: data.session.id,
            }}
            onSuccess={({ checkoutSessionId }) => {
            console.log(`Stripe checkout session succeeded. session id: ${checkoutSessionId}.`);
            }}
            onCancel={() => {
            console.log(`Stripe checkout session cancelled.`);
            }}
        />
        )
};