微信小程序API 富文本·EditorContext實(shí)例

2022-05-11 16:36 更新

EditorContext

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

EditorContext 實(shí)例,可通過 wx.createSelectorQuery 獲取。

EditorContext 通過 id 跟一個(gè) editor 組件綁定,操作對(duì)應(yīng)的 editor 組件。



方法:

EditorContext.blur(Object object)

基礎(chǔ)庫 2.8.3 開始支持,低版本需做兼容處理

編輯器失焦,同時(shí)收起鍵盤。

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)


EditorContext.clear(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

清空編輯器內(nèi)容

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)


EditorContext.format(string name, string value)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

修改樣式

參數(shù)

string name

屬性

string value

支持設(shè)置的樣式列表

name value verson
bold 2.7.0
italic 2.7.0
underline 2.7.0
strike 2.7.0
ins 2.7.0
script sub / super 2.7.0
header H1 / H2 / h3 / H4 / h5 / H6 2.7.0
align left / center / right / justify 2.7.0
direction rtl 2.7.0
indent -1 / +1 2.7.0
list ordered / bullet / check 2.7.0
color hex color 2.7.0
backgroundColor hex color 2.7.0
margin/marginTop/marginBottom/marginLeft/marginRight css style 2.7.0
padding/paddingTop/paddingBottom/paddingLeft/paddingRight css style 2.7.0
font/fontSize/fontStyle/fontVariant/fontWeight/fontFamily css style 2.7.0
lineHeight css style 2.7.0
letterSpacing css style 2.7.0
textDecoration css style 2.7.0
textIndent css style 2.8.0
wordWrap css style 2.10.2
wordBreak css style 2.10.2
whiteSpace css style 2.10.2

對(duì)已經(jīng)應(yīng)用樣式的選區(qū)設(shè)置會(huì)取消樣式。css style 表示 css 中規(guī)定的允許值。


EditorContext.getContents(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

獲取編輯器內(nèi)容

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)

object.success 回調(diào)函數(shù)

參數(shù)
Object res
屬性 類型 說明
html string 帶標(biāo)簽的HTML內(nèi)容
text string 純文本內(nèi)容
delta Object 表示內(nèi)容的delta對(duì)象


EditorContext.getSelectionText(Object object)

基礎(chǔ)庫 2.10.2 開始支持,低版本需做兼容處理。

獲取編輯器已選區(qū)域內(nèi)的純文本內(nèi)容。當(dāng)編輯器失焦或未選中一段區(qū)間時(shí),返回內(nèi)容為空。

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)

object.success 回調(diào)函數(shù)

參數(shù)
Object res
屬性 類型 說明
text string 純文本內(nèi)容


EditorContext.insertDivider(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

插入分割線

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)


EditorContext.insertImage(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

插入圖片。

地址為臨時(shí)文件時(shí),獲取的編輯器html格式內(nèi)容中 <img> 標(biāo)簽增加屬性 data-local,delta 格式內(nèi)容中圖片 attributes 屬性增加 data-local 字段,該值為傳入的臨時(shí)文件地址。

開發(fā)者可選擇在提交階段上傳圖片到服務(wù)器,獲取到網(wǎng)絡(luò)地址后進(jìn)行替換。替換時(shí)對(duì)于html內(nèi)容應(yīng)替換掉 <img> 的 src 值,對(duì)于 delta 內(nèi)容應(yīng)替換掉 insert { image: abc } 值。

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
src string 圖片地址,僅支持 http(s)、base64、云圖片(2.8.0)、臨時(shí)文件(2.8.3)。
alt string 圖像無法顯示時(shí)的替代文本
width string 圖片寬度(pixels/百分比)
height string 圖片高度 (pixels/百分比)
extClass string 添加到圖片 img 標(biāo)簽上的類名
data Object data 被序列化為 name=value;name1=value2 的格式掛在屬性 data-custom 上
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)

示例代碼

this.editorCtx.insertImage({
  src: 'xx',
  width: '100px',
  height: '50px',
  extClass: className
})


EditorContext.insertText(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

覆蓋當(dāng)前選區(qū),設(shè)置一段文本

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
text string 文本內(nèi)容
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)


EditorContext.redo(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

恢復(fù)

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)


EditorContext.removeFormat(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

清除當(dāng)前選區(qū)的樣式

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)


EditorContext.scrollIntoView()

基礎(chǔ)庫 2.8.3 開始支持,低版本需做兼容處理

使得編輯器光標(biāo)處滾動(dòng)到窗口可視區(qū)域內(nèi)。

EditorContext.setContents(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

初始化編輯器內(nèi)容,html和delta同時(shí)存在時(shí)僅delta生效

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
html string 帶標(biāo)簽的HTML內(nèi)容
delta Object 表示內(nèi)容的delta對(duì)象
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)


EditorContext.undo(Object object)

基礎(chǔ)庫 2.7.0 開始支持,低版本需做兼容處理。

撤銷

參數(shù)

Object object

屬性 類型 默認(rèn)值 必填 說明
success function 接口調(diào)用成功的回調(diào)函數(shù)
fail function 接口調(diào)用失敗的回調(diào)函數(shù)
complete function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會(huì)執(zhí)行)


以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)