Shulou(Shulou.com)06/02 Report--

This article will explain in detail how to write the vue project payment function code, the content of the article is of high quality, so the editor will share it with you for reference. I hope you will have a certain understanding of the relevant knowledge after reading this article.

1. Alipay method:

Alipay mode: click Alipay, call the background interface (with order number), and return a form form (HTML string structure) in the background.

If you submit a form, you can call Alipay.

Code: / / alipayWap: form fragment returned by the background API methods: {toAlipay () {this.$axios.get ('xxx') .then (res = > {this.alipayWap = res) / / wait for dom update, wait for this form form to have this.$nextTick (() = > {this.$refs.alipayWap.children [0] .submit ()}})

two。 WeChat Pay

Most of the work is done at the back end, where the order is generated by the back end to connect with Tencent, and the front end only needs to be responsible for the payment QR code returned by the back end (generated by the back end. In some cases, the front end can also go to the front end to dock the order and generate the QR code by the front end itself, which is rare.) it can be displayed at the terminal for users to scan the code.

You need to generate the QR code page based on the url returned by the backend, as shown in the figure.

QR code display code:

Request the payment QR code interface of the backend

Finally, after scanning the code to pay, it can be completed.

On how to write the vue project payment function code is shared here, I hope the above content can be of some help to you, can learn more knowledge. If you think the article is good, you can share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.