前言:

与微信小程序不同,支付宝小程序的富文本组件并不能直接支持html代码,如:

如上,支付宝小程序的富文本组件只支持数组类型,html代码需要使用 mini-html-parser 转换,具体用法后文详细说明。

mini-html-parser2:

1. 插件安装:

小程序开发者工具左侧文件列表界面空白处单击右键——在终端中打开:

2.输入以下代码安装插件:

npm install mini-html-parser2 --save

安装完成后文件列表中就多了node_modules目录了:

3.页面引入插件及调用:

//引入插件
import parse from 'mini-html-parser2';
//使用插件进行html代码转换(htmlStr为html代码,htmlNodes是转换后的数组)
parse(htmlStr, (err, htmlNodes) => {
if (!err) {
self.setData({
htmlNodes
  });
}
})
<rich-text nodes="{{htmlNodes}}" />

支付宝小程序开发——rich-text富文本组件支持html代码的更多相关文章

  1. 微信小程序中显示html富文本的方法

    微信小程序中显示html富文本的方法 使用方法:git地址:https://github.com/icindy/wxParse 一.下载wxParse文件 二.在要引入的页面的js文件中,引入文件 j ...

  2. Tarojs+redux支付宝小程序开发攻略

    技术选型 对于习惯react语法的开发者来讲,RN是实现native的必备工具. 我们甚至可以屏蔽官方稳定而强大的配置层,直接上手开发. 而后,同为表层React语法的Rax.Taro这样的开源多端开 ...

  3. 支付宝小程序开发之与微信小程序不同的地方

    前言: 本文仅汇总微信小程序移植支付宝小程序过程中遇到的一些不同的地方,详细请参考官方开发文档. 网络请求: 对于网络请求,基本上改动不大,也就支付宝小程序没有responseType属性及响应码字段 ...

  4. 支付宝小程序开发——获取位置API没有城市区号的最佳处理方案

    前言: 需要对城市区号进行判断,但是支付宝小程序提供的my.getLocation() API返回的数据中只有6位的城市行政代码,诸如:深圳(440300),并没有区号(0755),那么怎么办呢? 需 ...

  5. 支付宝小程序开发——如何获取支付宝小程序页面的https链接

    前边介绍过通过配置支付宝Scheme协议alipays://来实现h5到小程序的跳转,其实还可以获取小程序页面的https格式链接,虽然支付宝官方并没有直接提供方案,但是通过小程序后台的“码管理”给页 ...

  6. 支付宝小程序开发——H5跳转到小程序(获取小程序页面的链接)

    前言: 这个问题支付宝小程序官方文档并没有专门说明,钉钉群的官方技术支持给了个开发者社区的帖子,详见:如何跳转小程序. 如果配置的页面没有参数还好,不会出问题,如果有参数,很可能配出来的链接无法正常获 ...

  7. 小程序解析html之富文本插件wxParse

    近期,开发小程序时,遇到后台给我返回了一串html代码,需要我这边来解析,头疼了好久,网上找资料找了变天,终于找到wxParse,然而看到的都是针对于页面中有单个html或者固定数据的,我现在的问题是 ...

  8. Selenium Webdriver——JS处理rich text(富文本框)

    126邮件正文邮件的rich text 先让selenium切换到iframe中 driver.switchTo().frame(driver.findElement(By.className(&qu ...

  9. selenium处理rich text(富文本框)

    WordPress 的 rich  text 采用js,先让selenium切换到iframe中 driver.switchTo().frame("content_ifr"); 然 ...

随机推荐

  1. Golang: 读写之外的其他文件操作

    在上一篇文章中,我们介绍了常用的文件读写操作,今天接着来研究一下,除了读写以外的其他常见文件操作. 一.创建目录: package main import ( "fmt" &quo ...

  2. 爬虫之scrapy核心组件

    Scrapy一个开源和协作的框架,其最初是为了页面抓取 (更确切来说, 网络抓取 )所设计的,使用它可以以快速.简单.可扩展的方式从网站中提取所需的数据.但目前Scrapy的用途十分广泛,可用于如数据 ...

  3. Jmeter 使用badyboy 录制脚本

    在使用jemeter 做测试时,一般需要先录制脚本,这个过程可以通过手工添加采样器进行采样. 比较方便的方法是使用badboy 来录制脚本录制完脚本后使用jemeter 再做压力测试,大大加快测试进度 ...

  4. Docker容器的简单使用

    1. docker的使用 1> 创建容器 创建并启动容器: docker run -it -name 容器名 镜像: 版本  /bin/sh(bash) 创建并不启动容器:docker crea ...

  5. 解决:IntelliJ IDEA输入法不跟随光标

    主界面 Ctrl+Shift+a 输入 switch boot jdk 然后回车 选择自己安装的jdk: 如果没有找到,就点最下面的...,然后找到自己的jdk安装路径,确定即可. 保存自动重启就ok ...

  6. HDU6625: three arrays (字典树处理xor)

    题意:给出A数组,B数组,你可以对A和B分别进行重排列,使得C[i]=A[i]^B[i]的字典序最小. 思路:对于这类题,显然需要建立字典树,然后某种形式取分治,或者贪心.  假设现在有了两颗字典树A ...

  7. 16、Python面向对象进阶

    一.对象的继承 Python中支持一个类同时继承多个父类 class Parent1: pass class Parent2: pass class Sub1(Parent1, Parent2): p ...

  8. new的模拟实现

    new 一句话介绍 new: new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象类型之一 也许有点难懂,我们在模拟 new 之前,先看看 new 实现了哪些功能. 举个例子: // ...

  9. wraps装饰器的作用

    装饰器的本质是一个闭包函数,作用在于不改变原函数功能和调用方法的基础上给它添加额外的功能.装饰器在装饰一个函数时,原函数就成了一个新的函数,也就是说其属性会发生变化,所以为了不改变原函数的属性,我们会 ...

  10. iOS的事件派发

    dispatchPreprocessedEventFromEventQueue 先定位:hittest * thread #1, queue = 'com.apple.main-thread', st ...