VUE渲染后端返回含有script標(biāo)簽的html字符串示例
在接入支付寶支付模塊的時(shí)候,支支返回的是一個(gè)form串,細(xì)看一下還有一個(gè)script標(biāo)簽,如何將其渲染出來(lái)給大家分享一下經(jīng)驗(yàn)。注意點(diǎn):不能在當(dāng)前頁(yè)面追加任何元素例如原生js:innerHtml、appendChiled等等;Vue原生v-html也不可以因?yàn)槠渲荒茕秩緃tml標(biāo)簽,script不能夠識(shí)別。
需要重新創(chuàng)建一個(gè)空白Vue組件,用router進(jìn)行傳參,傳參方式(新窗口打開(kāi))
let routeData = this.$router.resolve({ path: 'Recharge', query: { htmls: resp.data.dataObj }}); window.open(routeData.href, '_blank');
解析方式
const div = document.createElement('div'); div.innerHTML = this.$route.query.htmls; document.body.appendChild(div); document.forms[0].submit();
(PS:評(píng)論區(qū)的兄弟給了個(gè)意見(jiàn)大家可以參考下:
要保證的是頁(yè)面上存在一個(gè)已有的盒子 const data = await this.payOrder()
document.getElementById('pay').innerHTML = data;//此處form就是后臺(tái)返回接收到的數(shù)據(jù) document.forms[0].submit()
以上這篇VUE渲染后端返回含有script標(biāo)簽的html字符串示例就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue?echarts實(shí)現(xiàn)改變canvas長(zhǎng)和寬自適應(yīng)
這篇文章主要介紹了vue?echarts實(shí)現(xiàn)改變canvas長(zhǎng)和寬自適應(yīng)問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-04-04vue項(xiàng)目中Eslint校驗(yàn)代碼報(bào)錯(cuò)的解決方案
這篇文章主要介紹了vue項(xiàng)目中Eslint校驗(yàn)代碼報(bào)錯(cuò)的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-04-04Vue在 Nuxt.js 中重定向 404 頁(yè)面的方法
這篇文章主要介紹了Vue在 Nuxt.js 中重定向 404 頁(yè)面的方法,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-04-04基于Vue2-Calendar改進(jìn)的日歷組件(含中文使用說(shuō)明)
這篇文章主要介紹了基于Vue2-Calendar改進(jìn)的日歷組件(含中文使用說(shuō)明)的相關(guān)知識(shí),非常不錯(cuò),具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2019-04-04vue中如何動(dòng)態(tài)拼接this后面的變量
這篇文章主要介紹了vue中如何動(dòng)態(tài)拼接this后面的變量問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-07-07vue 解決data中定義圖片相對(duì)路徑頁(yè)面不顯示的問(wèn)題
這篇文章主要介紹了vue 解決data中定義圖片相對(duì)路徑頁(yè)面不顯示的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-08-08關(guān)于vue3?解決getCurrentInstance?打包后線上環(huán)境報(bào)錯(cuò)問(wèn)題
這篇文章主要介紹了vue3?解決getCurrentInstance?打包后線上環(huán)境報(bào)錯(cuò)問(wèn)題,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-05-05vue+element的表格實(shí)現(xiàn)批量刪除功能示例代碼
這篇文章主要介紹了vue+element的表格實(shí)現(xiàn)批量刪除功能示例代碼,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-08-08