开发者社区
社区提问意见反馈
开发者钉组织
扫描二维码
加入支付宝开发者钉组织
视图容器
基础内容
表单组件
导航
媒体组件
画布
地图
开放组件
无障碍访问
页面属性配置节点
扩展组件
广告
开发 > 组件 > 基础内容 > rich-text 富文本
收藏
订阅更新
我的文档
设置
简介
富文本。
使用限制
版本要求基础库 1.11.0 及以上,若版本较低,建议做 兼容处理
native 渲染引擎:暂不支持。可以通过 my.caniuse('rich-text') 判断是否支持。
富文本里面写 js 不支持事件执行。
rich-text 支持 a 标签,不支持超链接,不支持注释。
扫码体验

使用
在线示例

属性说明
属性
类型
描述
nodes
array/string
节点列表。基础库 2.8.5
开始支持 html string,2.8.5
以下版本可使用
将 html string 转化为 nodes 数组。
space
string
显示连续空格。 有效值
nbsp:根据字体设置的空格大小。
emsp:中文字符空格大小。
ensp:中文字符空格一半大小。
版本要求:基础库 2.8.7
及以上。
ontap
eventhandle
触摸。
ontouchstart
eventhandle
触摸动作开始。
ontouchmove
eventhandle
触摸移动事件。
ontouchcancel
eventhandle
触摸动作被打断。
ontouchend
eventhandle
触摸动作结束。
onlongtap
eventhandle
触摸后,超过 500ms 再离开。
nodes 属性
现支持两种节点:元素节点和文本节点,通过 type 来区分。默认是元素节点,在富文本区域里显示的 html 节点。
元素节点
属性
类型
必填
描述
type
string

节点类型 默认值:node
name
string

标签名。支持部分受信任的 html 节点。
attrs
object

属性。支持部分受信任的属性,遵循 pascal 命名法。
children
array

子节点列表。结构和 nodes 相同。
marks
object

可在 tap 和 longtap 事件中接收。 说明:自基础库 2.7.1
起,在 tap 和 longtap 事件中,可以通过 event.detail.marks 获得从触发事件的节点到根节点上所有的 marks 合并结果。如果存在同名数据,子节点将覆盖父节点。
受信任的 html 节点及属性。支持 class 和 style 属性,不支持 id 属性。
节点
额外支持的属性
说明
a
-
-
abbr
-
-
address
-
基础库 2.7.4
起支持
article
-
基础库 2.7.4
起支持
aside
-
基础库 2.7.4
起支持
b
-
-
bdr
-
基础库 2.7.4
起支持
bdo
dir
基础库 2.7.4
起支持
big
-
基础库 2.7.4
起支持
blockquote
-
-
br
-
-
caption
-
基础库 2.7.4
起支持
center
-
基础库 2.7.4
起支持
cite
-
基础库 2.7.4
起支持
code
-
-
col
span, width
-
colgroup
span, width
-
dd
-
-
del
-
-
div
-
-
dl
-
-
dt
-
-
em
-
-
fieldset
-
-
font
-
基础库 2.7.4
起支持
footer
-
基础库 2.7.4
起支持
h1
-
-
h2
-
-
h3
-
-
h4
-
-
h5
-
-
h6
-
-
header
-
基础库 2.7.4
起支持
hr
-
-
i
-
-
img
alt, src, height, width
-
ins
-
-
label
-
-
legend
-
-
li
-
-
mark
-
基础库 2.7.4
起支持
nav
-
基础库 2.7.4
起支持
ol
start, type
-
p
-
-
pre
-
基础库 2.7.4
起支持
q
-
-
rt
-
基础库 2.7.4
起支持
ruby
-
基础库 2.7.4
起支持
s
-
基础库 2.7.4
起支持
section
-
基础库 2.7.4
起支持
small
-
基础库 2.7.4
起支持
span
-
基础库 2.7.4
起支持
strong
-
-
sub
-
-
sup
-
-
table
width
-
tbody
-
-
td
colspan, height, rowspan, width
-
tfoot
-
-
th
colspan, height, rowspan, width
-
thead
-
-
tr
-
-
tt
-
基础库 2.7.4
起支持
u
-
基础库 2.7.4
起支持
ul
-
-
仅支持如下字符实体,其他字符实体会导致组件无法渲染。基础库 2.7.5 开始支持任意实体节点。
显示结果
描述
实体名称
空格。
<
小于号。
<
>
大于号。
>
&
和号。
&
"
引号。
"
'
撇号。
'
文本节点
属性
类型
必填
描述
type
string

节点类型。type 为 text
text
string

文本。
faq
rich-text 富文本如何插入 html 包含标签的数据?
需要自己将 html string 转化为 nodes 数组。
如何处理 html string 中存在多个 img 标签且不闭合时,mini-html-parser 会转换错误?
0.3.0 已解决此问题,若当前使用老版本,请升级到最新的 0.3.0 版本即可。
如何为 rich-text 富文本 添加链接跳转功能?
受小程序管控原因,rich-text 中的 a 标签,无法像前端页面中,配置 即可实现跳转;小程序中需要使用对应的 jsapi 或者 路由 jsapi 实现跳转路由。
即把跳转链接放到 node marks 属性中,通过 rich-text ontap 事件跳转。
内容没有解决您的问题?您还可以前往 或 寻求帮助
凯发k8官方网娱乐官方 copyright © 2022 支付宝(杭州)信息技术有限公司  | icp证浙b2-20160559
该文档对你是否有帮助?
当前页面目录
网站地图