建站
咨詢
售后
建站咨詢
新聞中心
editor
基礎(chǔ)庫 2.7.0 開始支持，低版本需做 兼容處理。
10年積累的網(wǎng)站設(shè)計(jì)、網(wǎng)站制作經(jīng)驗(yàn)，可以快速應(yīng)對客戶對網(wǎng)站的新想法和需求。提供各種問題對應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識(shí)你，你也不認(rèn)識(shí)我。但先網(wǎng)站設(shè)計(jì)后付款的網(wǎng)站建設(shè)流程，更有班瑪免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。
富文本編輯器，可以對圖片、文字進(jìn)行編輯。
編輯器導(dǎo)出內(nèi)容支持帶標(biāo)簽的 html和純文本的 text，編輯器內(nèi)部采用 delta 格式進(jìn)行存儲(chǔ)。
通過setContents接口設(shè)置內(nèi)容時(shí)，解析插入的 html 可能會(huì)由于一些非法標(biāo)簽導(dǎo)致解析錯(cuò)誤，建議開發(fā)者在小程序內(nèi)使用時(shí)通過 delta 進(jìn)行插入。
富文本組件內(nèi)部引入了一些基本的樣式使得內(nèi)容可以正確的展示，開發(fā)時(shí)可以進(jìn)行覆蓋。需要注意的是，在其它組件或環(huán)境中使用富文本組件導(dǎo)出的html時(shí)，需要額外引入 這段樣式，并維護(hù)
圖片控件僅初始化時(shí)設(shè)置有效。
相關(guān) api：EditorContext
| 屬性 | 類型 | 默認(rèn)值 | 必填 | 說明 | 最低版本 |
|---|---|---|---|---|---|
| read-only | boolean | false | 否 | 設(shè)置編輯器為只讀 | 2.7.0 |
| placeholder | string | 否 | 提示信息 | 2.7.0 | |
| show-img-size | boolean | false | 否 | 點(diǎn)擊圖片時(shí)顯示圖片大小控件 | 2.7.0 |
| show-img-toolbar | boolean | false | 否 | 點(diǎn)擊圖片時(shí)顯示工具欄控件 | 2.7.0 |
| show-img-resize | boolean | false | 否 | 點(diǎn)擊圖片時(shí)顯示修改尺寸控件 | 2.7.0 |
| bindready | eventhandle | 否 | 編輯器初始化完成時(shí)觸發(fā) | 2.7.0 | |
| bindfocus | eventhandle | 否 | 編輯器聚焦時(shí)觸發(fā)，event.detail = {html, text, delta} | 2.7.0 | |
| bindblur | eventhandle | 否 | 編輯器失去焦點(diǎn)時(shí)觸發(fā)，detail = {html, text, delta} | 2.7.0 | |
| bindinput | eventhandle | 否 | 編輯器內(nèi)容改變時(shí)觸發(fā)，detail = {html, text, delta} | 2.7.0 | |
| bindstatuschange | eventhandle | 否 | 通過 Context 方法改變編輯器內(nèi)樣式時(shí)觸發(fā)，返回選區(qū)已設(shè)置的樣式 | 2.7.0 |
編輯器內(nèi)支持部分 HTML 標(biāo)簽和內(nèi)聯(lián)樣式，不支持class和id
支持的標(biāo)簽
不滿足的標(biāo)簽會(huì)被忽略，
儲(chǔ)存。
| 類型 | 節(jié)點(diǎn) |
|---|---|
| 行內(nèi)元素 | |
| 塊級(jí)元素 | |
支持的內(nèi)聯(lián)樣式
內(nèi)聯(lián)樣式僅能設(shè)置在行內(nèi)元素或塊級(jí)元素上，不能同時(shí)設(shè)置。例如 font-size 歸類為行內(nèi)元素屬性，在 p 標(biāo)簽上設(shè)置是無效的。
| 類型 | 樣式 |
|---|---|
| 塊級(jí)樣式 | text-align direction margin margin-top margin-left margin-right margin-bottompadding padding-top padding-left padding-right padding-bottom line-height text-indent |
| 行內(nèi)樣式 | font font-size font-style font-variant font-weight font-familyletter-spacing text-decoration color background-color |
提示：
- 使用 catchtouchend 綁定事件則不會(huì)使編輯器失去焦點(diǎn)(2.8.3)
- 插入的 html 中事件綁定會(huì)被移除
- formats 中的 color 屬性會(huì)統(tǒng)一以 hex 格式返回
- 粘貼時(shí)僅純文本內(nèi)容會(huì)被拷貝進(jìn)編輯器
- 插入 html 到編輯器內(nèi)時(shí)，編輯器會(huì)刪除一些不必要的標(biāo)簽，以保證內(nèi)容的統(tǒng)一。例如
xxx
會(huì)改寫為xxx
- 編輯器聚焦時(shí)頁面會(huì)被上推，系統(tǒng)行為以保證編輯區(qū)可見
當(dāng)前題目：創(chuàng)新互聯(lián)小程序教程：微信小程序表單組件 editor
文章源于：http://www.5511xx.com/article/dhigesh.html
