微信小程式圖文編輯元件開發(偽富文字編輯)

Anho發表於2018-08-10

手機上做富文字編輯本身就挺麻煩的,小程式就更麻煩了,畢竟小程式沒有DOM操作,一般就用web-view嵌一個網頁,在網頁裡實現再輸出到小程式。

但是需要在小程式上做富文字編輯的場景,絕大多數是給使用者使用的,也就是說不需要太複雜的功能,所以就想說做一個小程式上的圖文編輯器,於是就做了個開源的元件(View on Github),第一版大概的效果是下面這個樣子

微信小程式圖文編輯元件開發(偽富文字編輯)

大致的思路就是不斷的新增textareaimage來組成段落連成一篇圖文,輸出按照小程式原生元件rich-text支援的兩種格式輸出,開發過程中textarea相關的坑也遇到一些,過幾天有空另外分享

之後會不斷更新,TODO List如下

  • 文字格式編輯(字號,顏色等)
  • 圖片轉Base64儲存(無需上傳)
  • 編輯預覽
  • 更多標籤支援(怕是不想做)

View on Github

相關文章