前言

富文本格式（Rich Text Format）即RTF格式，又称多文本格式，是由微软公司开发的跨平台文档格式。大多数的文字处理软件都能读取和保存RTF文档。它是一种方便于不同的设备、系统查看的文本和图形文档格式。

RTF使用美国国内标准协会（ANSI）、 PC-8、 Macintosh（mac苹果），或 IBM 的 PC 字符设置控制显示形式和打印形式。在不同的操作系统下创建的RTF文档可以在多种操作系统和应用程序之间互相传输、查看。其作为 MS-DOS、 Microsoft Windows、 OS/2、 Macintosh苹果系统，应用程序之间处理文档的特殊翻译软件。

微信小程序富文本属性：

nodes子属性

现支持两种节点，通过type来区分，分别是元素节点和文本节点，默认是元素节点，在富文本区域里显示的HTML节点

1、元素节点：type = node

2、文本节点：type = text

一、富文本使用

1.富文本中预览图片原生使用

<rich-text space="emsp" nodes="{{nodes}}" bindtap="tap"></rich-text>

data: {
  // 示例 1 代码
  nodes: [{
    name: 'div',
    attrs: {
      class: 'div_class',
      style: 'line-height: 20px;padding:20px;'
    },
    children: [
      {
        type: 'text',
        text: '小程序实践'
      }, {
        name: 'img',
        attrs: {
          src: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.daimg.com%2Fuploads%2Fallimg%2F140505%2F1-140505004P3.jpg&refer=http%3A%2F%2Fimg.daimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1663946818&t=f4155ceebdd0eb509fd172de7feef3c1',
          style: 'width:100%'
        }
      }, {
        name: 'img',
        attrs: {
          src: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2Fedpic%2F54%2F7f%2F7e%2F547f7eea46e505ecc72a30708959169d.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1663946818&t=a5f8d704887bf93acbcd016e6c220d71',
          style: 'width:100%'
          // ,style:'width:100%;font-size:0;display:block;'//修改样式
          ,class: 'img'
        }
      }, {
        name: 'img',
        attrs: {
          src: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.pconline.com.cn%2Fimages%2Fupload%2Fupc%2Ftx%2Fphotoblog%2F1308%2F11%2Fc7%2F24373320_24373320_1376225083921.jpg&refer=http%3A%2F%2Fimg.pconline.com.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1663946817&t=abb1d293958695bb875b39a70d79a7b5',
          style: 'width:100%'
        }
      }
    ]
  }],
  urls: [],
},
tap(e) {
  let urls = this.data.urls
  wx.previewImage({
    current: urls[0],
    urls: urls
  })
},
onReady() {
  // 取出 urls
  function findUrl(nodes) {
    let urls = []
    nodes.forEach(item => {
      if (item.name == 'img' && item.attrs) {
        for (const key in item.attrs) {
          if (key == 'src') {
            urls.push(item.attrs[key])
          }
        }
      }
      if (item.children) {
        urls = urls.concat(findUrl(item.children))
      }
    })
    return urls
  }
  this.data.urls = findUrl(this.data.nodes)
},