rich-text 富文本
收藏我的收藏
收藏基础库 1.0.0 开始支持本组件。
富文本。
属性说明
属性名 | 类型 | 默认值 | 必填 | 说明 | 最低支持版本 |
nodes | (Node | Text)[] | string | [ ] | 否 | 节点列表 / HTML String | 1.0.0 |
space | string | | 否 | 显示连续空格。 有效值：
| 2.52.0 |
Node 类型说明
object 类型，属性如下：
属性名 | 类型 | 默认值 | 必填 | 说明 | 最低支持版本 |
name | string | 无 | 是 | 标签名，仅支持受信任的 HTML 节点。 | 1.0.0 |
type | string | 'node' | 否 | 节点类型。 | 1.0.0 |
attrs | object | 无 | 否 | 属性，仅支持受信任的属性，遵循 Pascal 命名法。 | 1.0.0 |
children | (Node | Text)[] | 无 | 否 | 子节点列表，结构和 nodes 一致。 | 1.0.0 |
Text 类型说明
object 类型，属性如下：
属性名 | 类型 | 默认值 | 必填 | 说明 | 最低支持版本 |
text | string | 无 | 是 | 文本内容，支持 entities。 | 1.0.0 |
type | string | 'node' | 是 | 节点类型，此处需要修改成 'text'。 | 1.0.0 |
受信任的 HTML 节点及属性
如果使用了不受信任的 HTML 节点，该节点及其所有子节点将会被移除。
所有节点 attrs 属性均支持 class 和 style；额外支持的属性见下表：
节点 | 额外支持的属性 | 最低支持版本 |
a | 无 | 1.0.0 |
abbr | 无 | 1.0.0 |
address | 无 | 1.78.0 |
article | 无 | 1.78.0 |
aside | 无 | 1.78.0 |
b | 无 | 1.0.0 |
bdi | 无 | 1.78.0 |
bdo | dir | 1.78.0 |
big | 无 | 1.78.0 |
blockquote | 无 | 1.0.0 |
br | 无 | 1.0.0 |
caption | 无 | 1.78.0 |
center | 无 | 1.78.0 |
cite | 无 | 1.78.0 |
code | 无 | 1.0.0 |
col | span, width | 1.0.0 |
colgroup | span, width | 1.0.0 |
dd | 无 | 1.0.0 |
del | 无 | 1.0.0 |
div | 无 | 1.0.0 |
dl | 无 | 1.0.0 |
dt | 无 | 1.0.0 |
em | 无 | 1.0.0 |
fieldset | 无 | 1.0.0 |
font | 无 | 1.78.0 |
footer | 无 | 1.78.0 |
h1 | 无 | 1.0.0 |
h2 | 无 | 1.0.0 |
h3 | 无 | 1.0.0 |
h4 | 无 | 1.0.0 |
h5 | 无 | 1.0.0 |
h6 | 无 | 1.0.0 |
header | 无 | 1.78.0 |
hr | 无 | 1.0.0 |
i | 无 | 1.0.0 |
img | alt, src, height, width | 1.0.0 |
ins | 无 | 1.0.0 |
label | 无 | 1.0.0 |
legend | 无 | 1.0.0 |
li | 无 | 1.0.0 |
mark | 无 | 1.78.0 |
nav | 无 | 1.78.0 |
ol | start, type | 1.0.0 |
p | 无 | 1.0.0 |
pre | 无 | 1.0.0 |
q | 无 | 1.0.0 |
rt | 无 | 1.78.0 |
ruby | 无 | 1.78.0 |
s | 无 | 1.78.0 |
section | 无 | 1.78.0 |
small | 无 | 1.78.0 |
span | 无 | 1.0.0 |
strong | 无 | 1.0.0 |
sub | 无 | 1.0.0 |
sup | 无 | 1.0.0 |
table | width | 1.0.0 |
tbody | 无 | 1.0.0 |
td | colspan, height, rowspan, width | 1.0.0 |
tfoot | 无 | 1.0.0 |
th | colspan, height, rowspan, width | 1.0.0 |
thead | 无 | 1.0.0 |
tr | colspan, height, rowspan, width | 1.78.0 |
tt | 无 | 1.78.0 |
u | 无 | 1.78.0 |
ul | 无 | 1.0.0 |
video | src, poster | 1.0.0 |
扫码体验
代码示例
Bug & Tip
- •Tip：
nodes 推荐使用 (Node | Text)[] 类型，由于组件会将 string 类型转换为 (Node | Text)[] 类型，因而性能会有所下降；- •Tip：
rich-text 中的 html 内容不会触发绑定事件（如：bindtap 等），bindtap 等绑定事件只会在最外层的 rich-text 标签上触发；- •Tip：
name 属性大小写不敏感；- •Tip：
img 标签仅支持网络图片，并且只支持 HTTPS 协议；- •Tip：
video 标签仅支持网络视频，并且只支持 HTTPS 协议；- •Tip：如果在自定义组件中使用
rich-text 组件，那么仅自定义组件的 ttss 样式对 rich-text 中的 class 生效。
