基础内容包含：
icon、text、rich-text、progress
1.icon：图标
平台支持度：
| 5+App | H5 | 微信小程序 | 支付宝小程序 | 百度小程序 |
|---|---|---|---|---|
| √ | x | √ | √ | √ |
属性说明：
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| type | String | icon的类型 | |
| size | Number | 23 | icon的大小，单位px |
| color | Color | icon的颜色，同css的color |
各平台 type 有效值说明：
| 平台 | type 有效值 |
|---|---|
| 5+App | success, success_no_circle, info, warn, waiting, cancel, download, search, clear |
| 微信小程序 | success, success_no_circle, info, warn, waiting, cancel, download, search, clear |
| 支付宝小程序 | info, warn, waiting, cancel, download, search, clear, success, success_no_circle,loading |
| 百度小程序 | success, info, warn, waiting, success_no_circle, clear, search, personal, setting, top, close, cancel, download, checkboxSelected, radioSelected, radioUnselect |
2.text:文本
属性说明：
| 属性名 | 类型 | 默认值 | 说明 | 平台支持 |
|---|---|---|---|---|
| selectable | Boolean | false | 是否可长按选中文本 | |
space |
String | 显示连续空格 | 5+APP、H5、微信小程序 | |
| decode | Boolean | false | 是否解码 | 5+APP、H5、微信小程序 |
space 值说明:
| 值 | 说明 |
|---|---|
| ensp | 中文字符空格一半大小 |
| emsp | 中文字符空格大小 |
| nbsp | 根据字体设置的空格大小 |
Tips：
decode 可以解析的有 < > & '    各个操作系统的空格标准并不一致<text> 组件内只支持 <text> 嵌套除了文本节点以外的其他节点都无法长按选中支持 \n 方式换行如果使用 <span> 组件编译时会被转换为 <text>
3.rich-text:富文本
富文本，通过
nodes这个属性，来添加节点，现支持两种类型的节点，通过 type 来区分，分别是元素节点和文本节点，默认是元素节点，在富文本区域里显示的 HTML 节点。
支持默认事件包括：click、touchstart、touchmove、touchcancel、touchend、longpress。
rich-text富文本属性说明：
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| nodes | Array / String | [] | 节点列表 / HTML String |
nodes为元素节点时（type = node）：
| 属性 | 说明 | 类型 | 必填 | 备注 |
|---|---|---|---|---|
| name | 标签名 | String | 是 | 支持部分受信任的 HTML 节点 |
| attrs | 属性 | Object | 否 | 支持部分受信任的属性，遵循 Pascal 命名法 |
| children | 子节点列表 | Array | 否 | 结构和 nodes 一致 |
nodes为文本节点时（type = text）：
| 属性 | 说明 | 类型 | 必填 | 备注 |
|---|---|---|---|---|
| text | 文本 | String | 是 | 支持 entities |
受信任的html节点有： a、abbr、b、blockquote、br、code、col、colgroup、dd、del、div、dl、dt、em、fieldset、h1、h2、h3、h4、h5、h6、hr、i、img、ins、label、legend、li、ol、p、q、span、strong、sub、sup、table、tbody、td、tfoot、th、thead、tr、ul，支持class和style属性，不支持id属性
Tips:
nodes 属性推荐使用 Array 类型，因为在使用String类型时，组件会先将 String 类型转换为 Array 类型，这时性能会有所下降rich-text 组件内屏蔽所有节点的事件attrs 属性不支持 id ，支持 classname 属性大小写不敏感如果使用了不受信任的HTML节点，该节点及其所有子节点将会被移除img 标签仅支持网络图片如果在自定义组件中使用 rich-text 组件，那么仅自定义组件的 css 样式对 rich-text 中的 class 生效
4.progress:进度条
属性说明：
| 属性名 | 类型 | 默认值 | 说明 | 平台支持 |
|---|---|---|---|---|
| percent | Float | 无 | 百分比0~100，超过100时也只显示100%
|
|
| show-info | Boolean | false | 在进度条右侧显示百分比 | |
| stroke-width | Number | 6 | 进度条线的宽度，单位px | |
| activeColor | Color | #09BB07 | 已选择的进度条的颜色 | |
| backgroundColor | Color | #EBEBEB | 未选择的进度条的颜色 | |
| active | Boolean | false | 进度条从左往右的动画 | |
| active-mode | String | backwards | backwards: 动画从头播；forwards：动画从上次结束点接着播 | 微信小程序、5+APP、H5 |
| @activeend | EventHandle | 动画完成事件 | 微信小程序 |
示例：
在自定义进度条样式时，需要放在app.vue全局样式中才生效，不知道为什么（手动添加懵逼表情），并且在设置了进度条为圆角时，微信小程序中是不生效的，下图是浏览器中的效果：
