react怎么實現跳轉支付

本教程操作環境：Windows10系統、react18.0.0版、Dell G3電腦。

react怎么實現跳轉支付？

react 后臺返回html 銀聯支付前端頁面跳轉以及返回鏈接

(資料圖)

這幾天做銀聯的時候遇到了這樣一個問題 后端返回了一個完整的html,需要在前端跳轉到銀聯支付的頁面

跳轉頁面的代碼執行??

const div = document.createElement("div")              div.innerHTML = res //后臺返回接收到的html數據              document.body.appendChild(div);              document.forms[0].submit();

執行以上四步就可以實現

如果返回的是鏈接就可以直接執行??

window.location.href = res//鏈接地址

如果返回的是二維碼的形式可以跳轉頁面

history.push({pathname: "/Movie/Pay"})

react使用qrcode.react生成二維碼

安裝

npm install qrcode.react --saveimport QRCode from "qrcode.react"http://code_url這個是后端返回的鏈接//返回格式 code_url:"weixin://wxpay/bizpayurl?pr=5dDc2T1zz"<div style={{marginTop: 10}}>    <QRCode value={code_url}size={180}fgColor="#000000"/></div>

react頁面跳轉兩種方式

1.params形式，路由跳轉后，參數會顯示在地址欄

跳轉的方法是使用：history.push({pathname: "/personal", search: "test=22222"})

2.使用state的形式，頁面刷新不會丟失數據，并且地址欄也看不到數據

跳轉的方法是使用history.push({pathname: "/personal", state: {test: "dashboard"}})

推薦學習：《react視頻教程》

以上就是react怎么實現跳轉支付的詳細內容，更多請關注php中文網其它相關文章！

關鍵詞： React