# rich-text

Start from base library version 1.4.0. Please remaining backward compatible.

Rich text.

attribute type Default value Required Introductions Minimum version
nodes array/string [] no Node list/HTML String 1.4.0
space string no Display continuous spaces 2.4.1

space Legal value

value Introductions Minimum version
ensp Chinese character space half size
emsp Chinese character space size
nbsp Space size based on font

# nodes

Now supports two kinds of nodes, by type to distinguish, respectively, element node and text node, default is element node, in rich text area display HTML node

Element node: type = node

attribute Introductions type Required Remarks
name Tag name string yes Support partially trusted HTML node
attrs attribute object no Supports partially trusted properties, following the Pascal nomenclature
children Subnode list array no Structure and nodes Agreement

Text node: type = text

attribute Introductions type Required Remarks
text text string yes Supporting entities

# Trusted HTML nodes and properties

Global support for class and style attributes,Id attribute is not supported

node attribute
a
abbr
address
article
aside
b
bdi
bdo dir
big
blockquote
br
caption
center
cite
code
cabbage span,width
colgroup span,width
dd
of the
div
dl
dt
in
fieldset
font
footer
h1
h2
h3
h4
h5
h6
header
hr
i
img alt,src,height,width
ins
label
legend
li
mark
isn't
ol start,type
p
pre
q
rt
ruby
s
section
small
span
strong
sub
sup
table width
tbody
td colspan,height,rowspan,width
tfoot
th colspan,height,rowspan,width
thead
tr colspan,height,rowspan,width
Tt
in the
hive

# Bug & Tip

  1. tip: nodes Not recommended. String Type, performance will drop.
  2. tip: rich-text Masking all node events within a component.
  3. tip: attrs Property is not supported id Support class 。
  4. tip: name Property is not case sensitive.
  5. tip: If an untrusted HTML node is used, the node and all its children are removed.
  6. tip: img Tags only support web pictures.
  7. tip: If you use the rich-text Component, then only the custom component s wxss Style pair rich-text to hit the target class Entry into force.

# sample code

Preview with Developer Tool