react-native-razorpay-expo v2.0.1
react-native-razorpay
React Native wrapper around our Android and iOS mobile SDKs
Note: The following documentation is only focussed on the react-native wrapper around our Android and iOS sdks. To know more about our sdks and how to link them within the projects, refer to the following documentation-
Android - https://docs.razorpay.com/v1/page/android/
iOS - https://razorpay.com/docs/ios/
To know more about Razorpay payment flow and steps involved, read up here: https://docs.razorpay.com/docs
Installation
This has 3 steps: add to project, installation and linking iOS SDK.
Add to project
Run the following on terminal from your project directory:
Note: For Windows users, run this on Git Bash instead of Command Prompt. You can download Git for Windows here.
$ npm i react-native-razorpay-expokit --save
Automatic installation
$ react-native link react-native-razorpay-expokit
Manual installation
If the above command doesn't work for you (installation), try these steps from wiki.
Usage
Sample code to integrate with Razorpay can be found in index.js in the included example directory.
To run the example, simply do the following in example directory and then link iOS SDK as explained in the previous section:
$ npm i
Steps
Import RazorpayCheckout module to your component:
import RazorpayCheckout from 'react-native-razorpay';
Call
RazorpayCheckout.open
method with the paymentoptions
. The method returns a JS Promise wherethen
part corresponds to a successful payment and thecatch
part corresponds to payment failure.```js <TouchableHighlight onPress={() => { var options = { description: 'Credits towards consultation', image: 'https://i.imgur.com/3g7nmJC.png', currency: 'INR', key: 'rzp_test_1DP5mmOlF5G5ag', amount: '5000', name: 'foo', prefill: { email: 'void@razorpay.com', contact: '9191919191', name: 'Razorpay Software' }, theme: {color: '#F37254'} } RazorpayCheckout.open(options).then((data) => { // handle success alert(`Success: ${data.razorpay_payment_id}`); }).catch((error) => { // handle failure alert(`Error: ${error.code} | ${error.description}`); }); }}> ```
A descriptive list of valid options for checkout is available (under Manual Checkout column).
Things to be taken care:
- The react native plugin is wrapper around native SDK, so it doesn't work with the tools like expo which doesn't support native modules.
Contributing
See the CONTRIBUTING document. Thank you, contributors!
License
react-native-razorpay is Copyright (c) 2016 Razorpay Software Pvt. Ltd. It is distributed under the MIT License.
We ♥ open source software! See our other supported plugins / SDKs or contact us to help you with integrations.
7 years ago