微信小程序富文本三种方法+0.1rich-text+0.2插件+0.3webview

官方的跟我们想要的有些不同

把标签一个一个的定下来，这样是满足不了富文本的需求的

我们需要的可以是有文字，有图片掺杂在一起的

<p><img src="https://didu2.didu86.com/xiji/public/uploads/image/image/20180404/1522807330168113.png" title="1522807330168113.png" alt="home_pic5 (8).png"/></p>

所以我们的处理方式是后台上传图片的时候处理一下

方法有三种

1.使用rich-text

2.使用插件

3.使用web-view（网页渲染图片）

rich-text

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

富文本。

属性	类型	默认值	说明	最低版本
nodes	Array / String	[]	节点列表 / HTML String	1.4.0

<!-- rich-text.wxml -->
<rich-text nodes="{{nodes}}" bindtap="tap"></rich-text>

// rich-text.js
Page({
  data: {
    nodes: [{
      name: 'div',
      attrs: {
        class: 'div_class',
        style: 'line-height: 60px; color: red;'
      },
      children: [{
        type: 'text',
        text: 'Hello World!'
      }]
    }]
  },
  tap() {
    console.log('tap')
  }
})

遇到的问题也很多

1.使用起来图片需要处理一遍，因为图片的大小控制起来比较麻烦

第二中方法

使用web-view