//  alipayWap: 后臺(tái)接口返回的form 片段
<div v-html="alipayWap" ref="alipayWap"></div>
methods: {
	toAlipay () {
		this.$axios.get('xxx').then (res = > {
			this.alipayWap = res;
             // 等待dom更新, 等頁(yè)面中有這個(gè)form表單了
			this.$nextTick(() => {
            	this.$refs.alipayWap.children[0].submit()
          	})
		})
	}
}

2.微信支付

大部分工作量是后端的事情，訂單的生成由后端去和騰訊對(duì)接的，前端只需要負(fù)責(zé)將后端返回來的支付二維碼（由后端生成的，有些情況也可以前端去對(duì)接訂單生成之后由前端自己生成二維碼，這種情況比較少）展示在終端供用戶掃碼即可

需要自己根據(jù)后臺(tái)返回的url生成二維碼頁(yè)面，如圖所示

二維碼展示代碼：

請(qǐng)求后端的支付二維碼接口

最后，掃碼支付后，即可完成。

到此這篇關(guān)于vue項(xiàng)目支付功能的文章就介紹到這了,更多相關(guān)vue支付功能內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

Vue中props的使用詳解
props屬性是父子組件之間的通信橋梁。這篇文章主要介紹了Vue中props的使用,需要的朋友可以參考下
2018-06-06
在vue-cli3中使用axios獲取本地json操作
這篇文章主要介紹了在vue-cli3中使用axios獲取本地json操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2020-07-07
分享9個(gè)Vue的巧妙冷技巧
這篇文章主要介紹了分享9個(gè)Vue的巧妙冷技巧，文章首先通過巧用$attrs和$listeners的技巧展開，具有一定的參考價(jià)值，需要的小伙伴可以參考一下
2022-06-06
vue中如何修改props傳進(jìn)來的值
大家應(yīng)該都知道vue是單向數(shù)據(jù)流，一般我們也不會(huì)在子組件里面修改父組件傳進(jìn)來的值，但總有需要修改的時(shí)候，這篇文章主要介紹了vue中修改props傳進(jìn)來的值,需要的朋友可以參考下
2022-12-12
vue新玩法VueUse工具庫(kù)具體用法@vueuse/core詳解
這篇文章主要介紹了vue新玩法VueUse-工具庫(kù)@vueuse/core,VueUse不是Vue.use，它是一個(gè)基于?Composition?API?的實(shí)用函數(shù)集合，下面是具體的一些用法，需要的朋友可以參考下
2022-08-08
詳解vue.js+UEditor集成 [前后端分離項(xiàng)目]
本篇文章主要介紹了詳解vue.js+UEditor集成 [前后端分離項(xiàng)目] ，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-07-07
vue 動(dòng)態(tài)組件component
這篇文章主要介紹了 vue 動(dòng)態(tài)組件component ，vue提供了一個(gè)內(nèi)置的<component>,專門用來實(shí)現(xiàn)動(dòng)態(tài)組件的渲染，這個(gè)標(biāo)簽就相當(dāng)于一個(gè)占位符，需要使用is屬性指定綁定的組件，想了解更多詳細(xì)內(nèi)容的小伙伴請(qǐng)參考下面文章的具體內(nèi)容
2021-11-11
vue上傳圖片到oss的方法示例（圖片帶有刪除功能）
這篇文章主要介紹了vue上傳圖片到oss的方法示例（圖片帶有刪除功能），小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-09-09
Vue computed計(jì)算屬性總結(jié)記錄
在vue中，有時(shí)候你需要對(duì)data中的數(shù)據(jù)進(jìn)行處理，或者對(duì)抓取的數(shù)據(jù)進(jìn)行處理之后再掛載呈現(xiàn)到標(biāo)簽中，這時(shí)候你就需要計(jì)算屬性了，當(dāng)然看到這里你可能還是不了解那下面我舉幾個(gè)實(shí)例并附代碼解釋
2023-02-02
Vue中transition單個(gè)節(jié)點(diǎn)過渡與transition-group列表過渡全過程
這篇文章主要介紹了Vue中transition單個(gè)節(jié)點(diǎn)過渡與transition-group列表過渡全過程，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-04-04