小工具      在线工具  汉语词典  css  js  c++  java

VUE渲染后端返回包含脚本标签的html字符串

Web前端,vue 额外说明

收录于:39天前

当连接支付宝支付模块时，分支返回一个表单字符串。仔细一看，有一个script标签。下面我就和大家分享一下我的渲染经验。注意：当前页面不能追加任何元素如原生js：innerHtml、appendChiled等； Vue原生的v-html也不能使用，因为它只能渲染html标签，脚本无法识别它们。

需要重新创建一个空白的Vue组件，并使用router来传递参数。传递参数的方法（新窗口打开）

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：评论区的兄弟给出了一些意见供大家参考：

您需要确保页面上有一个现有的框 const data = wait this.payOrder()

document.getElementById('pay').innerHTML = data;//此处form就是后台返回接收到的数据 document.forms[0].submit()
 

. . .

相关推荐

额外说明

解决JD-GUI-1.6.6中文乱码

一、背景 在window环境下使用中遇到了乱码问题。 问题有两个： 一、从反编译代码的界面 CTRL+C 复制是如果选中内容包含中文，贴到其他编辑器时，中文丢失。 二、打开xml文件、properties文件等包含中文时。中文在反编译界面中显示乱码。用其

额外说明

使用STS临时访问凭证访问OSS

假设您是一个移动App开发者，希望使用阿里云OSS服务来保存App的终端用户数据，并且要保证每个App用户之间的数据隔离。此时，您可以使用STS授权用户直接访问OSS。 目录 一、DEMO项目文件截图 二、DEMO项目代码片段  三、 访问接口运行结果 

额外说明

mongodb索引选取及优化

问题 项目中有类似这样的查询场景 开始是对某个查询类似SQL select * from t_order where customerCode=xxxx and createTme> xxx and createTime<xxx order by cre

额外说明

连接SQL Server 数据库

目录 一、启动 SQL Server Management Studio 1. 点击 SQL Server Management Studio 菜单进入 2. 选择服务器和身份验证方式   3. 点击连接进入数据库   二、新建数据库  1.数据库的概念

额外说明

解决sql server 不支持variant的数据类型

解决sql server 不支持variant的数据类型 前言 问题发生的背景 解决思路 总结 博主 默语带您 Go to New World. ✍ 个人主页—— 默语 的博客-- 《java 面试题大全》 -惟余辈才疏学浅，临摹之作或有不妥之处，还请读

额外说明

MySQL增删查改

MySQL增删查改 1. 增加 1.1 语法 1.2 举列 2. 查询 2.1 语法 3. 修改 3.1 语法 4. 删除 4.1 语法 1. 增加 1.1 语法 insert into 表名(列名) values(值,...); 1.2 举列 CRE

额外说明

java基础-链表

小伙伴们，你们好呀！我是老寇！ 简述：链表由结点构成，结点有数值和指针，本文采用带头结点的链表进行演示！！！ 完整的图解：https://www.processon.com/view/link/5bd3442ce4b01af9b714a6e5 注：后继节

额外说明

spring编程式事务

事务是spring框架中一个核心的模块，事务的ACID特性想必对于学习java的同学来说都不陌生，对于spring，实现事务的底层原理其实很简单，就是通过AOP代理进行实现，而实现spring的AOP更底层的，就是使用反射机制完成的； 举例来说，当你的方

额外说明

Gradio的web界面演示与交互机器学习模型，主要特征《2》

上一篇文章是介绍了安装与使用，Gradio的web界面演示与交互机器学习模型，安装和使用《1》 了解到这个gradio，真是个贴心的产品，接下来更多的关注一些重要的细节特征，让我们去更完善和熟练的使用它。 1、简单计算器的示例   我们可以先直接运行代码

额外说明

wordpress创建_如何使用WordPress为客户创建发票

由 WordPress 创建 对于大多数自由职业者和小型企业来说，创建和发送发票是一项重要但繁琐的任务。使用正确的工具，您可以节省大量时间，而不是使用模板手动创建发票。在本文中，我们将向您展示如何使用 WordPress 为客户创建发票。 对于大多数自由

最新推荐

Oracle Database 11g ...
200天前
Cortex-M3内核Systick定时...
199天前
深度强化学习库的设计思想带你深入了解DR...
199天前
SpringBoot实现热部署详解
196天前
【Unity3D日常开发】Unity循环...
196天前
Python面试：文件读写的异常处理
196天前
深度学习梯度下降优化算法(AdaGrad...
196天前
【第58篇】MetaFormer实际上是...
196天前
CSS 记录工作中遇到的新样式(自用)
196天前
ROS从入门到精通6-2：gmappin...
196天前
ads via 小工具