微信小程序 富文本组件封装

开发背景

官方给我们提供了richtext 组件，也为我们提供了一个样板，但是当我们想云开发实现富文本内容添加时候，我们会发现很不方便，官方代码块易用性很差，这里我自己开发了一个组件。

目录

开发背景

演示效果

代码块

github

---

演示效果

相关代码

wxml 文件

<richtext id="richtext" content="{{list.content}}" placeholder="详细介绍"></richtext>

json 文件

{
  "navigationBarBackgroundColor": "#fff",
  "navigationBarTextStyle": "black",
  "usingComponents": { 
    "richtext": "../../dist/richtext/richtext"
  }
}

js 文件

const app = getApp()
Page({
  /**
   * 页面的初始数据
   */
  data: {
    list: { },
  },
  
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    const that = this
    let richtext = this.selectComponent("#richtext")
    //获取值 content
    setTimeout(() => {
       richtext.init(content) //初始赋值
    }, 800)
  },
  //点击提交
  async bindSave(e) {
    const that = this
    let richtext=this.selectComponent("#richtext")
    let value=await richtext.getcontents();
    //修改 是不是很方便呢
   
  },
})

github

https://gitee.com/oldboly/mini-program 

开源不易，给个star，同时也欢迎小伙伴继续开发,这里感谢三连。