# rich-text

基础库 1.4.0 开始支持,低版本需做兼容处理

微信 Windows 版:支持

微信 Mac 版:支持

微信 鸿蒙 OS 版:支持

渲染框架支持情况:Skyline (使用最新 Nightly 工具调试). WebView 樱花视频在线.

# 功能描述

富文本。

  1. 自基础库 2.33.0 版本开始支持(3.0.0 除外)。
  2. 遵循 skyline 的样式和布局规则,html tag 被映射成类似 text/span/view 节点,因此存在 text 嵌套问题。
  3. 不支持 td/tr 等表格布局 tag,也不支持 bdo/bdi 等文字排版 tag。建议完全使用 flex 等 skyline 支持的布局方式来创建富文本内容。
  4. 提供了可选的兼容布局模式选项 mode,但仍不保证与 WebView 表现 100% 一致。
  5. 在 2.33.0 基础库下,请尽可能避免为 html tag 使用 wx-rich-text 开头的类名。

# 通用属性

属性类型默认值必填说明最低版本
nodesarray/string[]节点列表/HTML String1.4.0
spacestring显示连续空格2.4.1
合法值说明
ensp中文字符空格一半大小
emsp中文字符空格大小
nbsp根据字体设置的空格大小
user-selectbooleanfalse文本是否可选,该属性会使节点显示为 block2.24.0

# Skyline 特有属性

属性类型默认值必填说明
modestringdefault布局兼容模式
合法值说明
default完全遵循 skyline 的默认行为,不对节点树进行任何更改。
compat尽可能将 tag 映射为 的形式。通常最接近 webview 的表现。
aggressive所有 tag 均被映射为形如 的形式。
inline-block实验性的 inline-block 布局策略,但无法实现折行。
web使用 webview 渲染富文本,基础库 3.6.0 开始支持。
web-static使用 webview 截图的方式渲染富文本,基础库 3.7.7 开始支持。

# nodes

现支持两种节点,通过type来区分,分别是元素节点和文本节点,默认是元素节点 樱花视频高清,在富文本区域里显示的HTML节点.

"樱花视频高清" # 元素节点:type = node

属性说明类型必填备注
name标签名string支持部分受信任的 HTML 节点
attrs属性object支持部分受信任的属性,遵循 Pascal 命名法
children子节点列表array结构和 nodes 一致

# 文本节点:type = text

属性说明类型必填备注
text文本string支持entities

# 受信任的HTML节点及属性

全局支持class和style属性,不支持id属性 樱花视频免费观看

节点属性
a
abbr
address
article
aside
b
bdi
bdodir
big
blockquote
br
caption
center
cite
code
colspan,width
colgroupspan,width
dd
del
div
dl
dt
em
fieldset
font
footer
h1
h2
h3
h4
h5
h6
header
hr
i
imgalt,src,height,width
ins
label
legend
li
mark
nav
olstart,type
p
pre
q
rt
ruby
s
section
small
span
strong
sub
sup
tablewidth
tbody
tdcolspan,height,rowspan,width
tfoot
thcolspan,height,rowspan,width
thead
trcolspan,height,rowspan,width
tt
u
ul

樱花视频高清 - # Bug & Tip

  1. tip: nodes 不推荐使用 String 类型,性能会有所下降。
  2. tip: rich-text 组件内屏蔽所有节点的事件。
  3. tip: attrs 属性不支持 id ,支持 class 。
  4. tip: name 属性大小写不敏感。
  5. tip: 如果使用了不受信任的HTML节点,该节点及其所有子节点将会被移除。
  6. tip: img 标签仅支持网络图片。
  7. tip: 如果在自定义组件中使用 rich-text 组件,那么仅自定义组件的 wxss 样式对 rich-text 中的 class 生效。

# 示例代码 (樱花视频免费观看)

在开发者工具中预览效果