React Native SDK
Integrate Moosyl payments in React Native apps
Overview
Use moosyl-react-native to render a ready-to-use payment view in your React Native app.
Installation
npm install moosyl-react-native react-native-webviewOptional locale detection:
npm install react-native-localizeQuick Start
Create a payment request on your backend first, then pass its transactionId to the component.
import { MoosylView } from "moosyl-react-native";
export function CheckoutScreen() {
return (
<MoosylView
apiKey="pk_test_..."
transactionId="txn_123"
items={[
{ label: "amountToPay", amount: 100 },
{ label: "serviceFee", amount: 5 },
]}
testMode={true}
locale="en"
onPaySuccess={(request) => console.log("Paid", request.id)}
onPayError={(err) => console.error(err)}
/>
);
}Notes
- Use your publishable key in mobile apps.
- Keep your secret key on backend only.
- Keep the total in
itemsaligned with the backend payment request amount.