💸 The companion React Native (iOS/Android/Web) frontend for express-payment-request.
This allows you to accept cross-platform payments using services such as Apple Pay without linking.
Using yarn
:
yarn add express-payment-request-react-native
Below, we show that a the client can define the amount to pay via the usePaymentRequest
hook. This requires that your app is wrapped within a PaymentRequestProvider.
import React from "react";
import { TouchableOpacity, Text } from "react-native";
import PaymentRequestProvider, { usePaymentRequest } from "express-payment-request-react-native";
function Button() {
const { requestPayment, clearPaymentRequest } = usePaymentRequest();
return (
<TouchableOpacity
onPress={() =>
requestPayment({
displayItems: [
{
label: "A client driven amount!",
amount: { currency: "USD", value: "0.02" },
},
],
total: {
label: "Total due",
amount: { currency: "USD", value: "0.02" },
},
})
}
>
<Text children="Request Payment of $0.02" />
</TouchableOpacity>
);
}
function App() {
return (
<PaymentRequestProvider uri="https://localhost:3000/payment">
<Button />
</PaymentRequestProvider>
);
}