我想为我的 react-js 应用程序集成支付网关 (razorpay)。有谁知道如何集成它？
这是我遇到错误的代码。
let rzp = new Razorpay(options);
rzp.open();
错误是:
TypeError: rzp.open is not a function
最佳答案
在我的例子中，上面的代码稍作修改就可以工作。
代替 let rzp = new Razorpay(options); 放let rzp = new window.Razorpay(options);
其余的都很好不要忘记注册并获得有效的API key 。
按照以下链接中的建议将脚本包含在 index.html 中
https://codepen.io/ankitstarski/pen/QgLXML .
示例如下
<!DOCTYPE html>
<html>
<head>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>FNETPOC</title>
</head>
<body>
<div id="root"></div>
<div id="modal"></div>
<div id="datetimemodal"></div>
<div id="slideshowmodal"></div>
<div id="playbuttonmodal"></div>
</body>
</html>
组件代码如下
class Checkout extends React.Component {
state = {
amount: 100
};
constructor() {
super()
this.changeAmount = this.changeAmount.bind(this);
this.openCheckout = this.openCheckout.bind(this);
}
changeAmount(e) {
this.setState({amount: e.target.value})
}
openCheckout() {
let options = {
"key": "YOUR_KEY_ID",
"amount": this.state.amount, // 2000 paise = INR 20, amount in paisa
"name": "Merchant Name",
"description": "Purchase Description",
"image": "/your_logo.png",
"handler": function (response){
alert(response.razorpay_payment_id);
},
"prefill": {
"name": "Harshil Mathur",
"email": "harshil@razorpay.com"
},
"notes": {
"address": "Hello World"
},
"theme": {
"color": "#F37254"
}
};
let rzp = new window.Razorpay(options);
rzp.open();
}
render () {
return (
<div>
<input type='text' onChange={
this.changeAmount
} />
<button onClick={this.openCheckout}>Pay Rs. {this.state.amount/100}</button>
</div>
)
}
}
关于reactjs - 在 React js 中安装 Razorpay，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52554599/