html rich text,rich-text

[TOC]

# rich-text

>1.可以渲染字符串模版

>

>2.可以渲染节点

*****

## 1.渲染HTMl字符

>1.在js文件外部定义一个 HTML字符串模板

```

/**定义一个字符串模板*/

const content=

`

Title

Life is like a box of

 chocolates.

A Link

`

```

>2.在数据中绑定

·`data: { content: content}`

>3.在wxml中使用定义好的HTML模板字符

``

## 2.渲染节点

**type = node**

| 属性 | 说明 | 类型 | 必填 | 备注 |

| --- | --- | --- | --- | --- |

| name | 标签名 | String | 是 | 支持部分受信任的HTML节点 |

| attrs | 属性 | Object | 否 | 支持部分受信任的属性，遵循Pascal命名法 |

| children | 子节点列表 | Array | 否 | 结构和nodes一致 |

*****

>1.在js文件中定义个节点数据

```

data:{

nodes: [{

name: 'div',//支持部分受信任的 HTML 节点

attrs: {

class: 'div-class',

style: 'line-height: 60px; color: #1AAD19;'

},//支持部分受信任的属性，遵循 Pascal 命名法

children: [

{

type: 'text',

text: 'You never know what you\'re gonna get.'

}

]//子节点列表

}]

}

```

>2.在页面渲染节点信息

``

*****

**渲染节点比渲染HTML字符更加稳定**