From 649ea4683884e20e9b9c9bc3fd678efbe9f3c8f6 Mon Sep 17 00:00:00 2001 From: anne-lxm <1076217653@qq.com> Date: Wed, 10 Aug 2022 18:03:27 +0800 Subject: [PATCH] =?UTF-8?q?editor=E7=99=BE=E5=BA=A6=E5=B0=8F=E7=A8=8B?= =?UTF-8?q?=E5=BA=8F=E5=85=BC=E5=AE=B9=E8=AF=B4=E6=98=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/api/media/editor-context.md | 121 +++++++++++++++++-------------- docs/component/editor.md | 18 ++--- 2 files changed, 75 insertions(+), 64 deletions(-) diff --git a/docs/api/media/editor-context.md b/docs/api/media/editor-context.md index 2401246d3..2f295afc4 100644 --- a/docs/api/media/editor-context.md +++ b/docs/api/media/editor-context.md @@ -3,19 +3,19 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery](/api/ui/nodes-info?id=createselectorquery) 获取。 ```js - onEditorReady() { - uni.createSelectorQuery().select('#editor').context((res) => { - this.editorCtx = res.context - }).exec() -} + onEditorReady() { + uni.createSelectorQuery().select('#editor').context((res) => { + this.editorCtx = res.context + }).exec() + } ``` -百度小程序 ```Editor``` 富文本编辑器动态库提供了 ```createEditorContext``` 的方法来获取。 +百度小程序 `Editor` 富文本编辑器动态库提供了 `createEditorContext` 的方法来获取。 ```js - onEditorReady() { - this.editorCtx = requireDynamicLib('editorLib').createEditorContext('editorId'); - } + onEditorReady() { + this.editorCtx = requireDynamicLib('editorLib').createEditorContext('editor'); + } ``` @@ -24,8 +24,6 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery - - **平台差异说明** |App|H5 |微信小程序 |支付宝小程序 |百度小程序 |字节跳动小程序、飞书小程序 |QQ小程序 |快手小程序|京东小程序| @@ -36,24 +34,23 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery **百度小程序引入动态库** -1. 在项目中引用动态库,在 ```manifest.json``` 中增添一项 ```dynamicLib``` +1. 在项目中引用动态库,在 `manifest.json` 中增添一项 `dynamicLib` ```js - "mp-baidu" : { - "appid" : "", - "setting" : { - "urlCheck" : true - }, - "dynamicLib": {//引入百度小程序动态库 - "editorLib": { - "provider": "swan-editor" - } - } - }, - + "mp-baidu" : { + "appid" : "", + "setting" : { + "urlCheck" : true + }, + "dynamicLib": {//引入百度小程序动态库 + "editorLib": { + "provider": "swan-editor" + } + } + } ``` -2. 在每个使用到富文本编辑器组件的页面,配置 ```pages.json``` 文件如下: +2. 在每个使用到富文本编辑器组件的页面,配置 `pages.json` 文件如下: ``` js { @@ -62,7 +59,7 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery "path": "pages/index/index", "style": { "navigationBarTitleText": "uni-app", - "usingSwanComponents": { + "usingComponents": { "editor": "dynamicLib://editorLib/editor" } } @@ -86,28 +83,32 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery **支持设置的样式列表** -| name | value | -| --- | --- | -| bold | | -| italic | | -| underline | | -| strike | | -| ins | | -| script | sub / super | -| header | H1 / H2 / h3 / H4 / h5 / H6 | -| align | left / center / right / justify | -| direction | rtl | -| indent | -1 / +1 | -| list | ordered / bullet / check | -| color | hex color | -| backgroundColor | hex color | -| margin/marginTop/marginBottom/marginLeft/marginRight | css style | -| padding/paddingTop/paddingBottom/paddingLeft/paddingRight | css style | -| font/fontSize/fontStyle/fontVariant/fontWeight/fontFamily | css style | -| lineHeight | css style | -| letterSpacing | css style | -| textDecoration | css style | -| textIndent | css style | +| name | value |平台差异说明| +| --- | --- |--- | +| bold | || +| italic | || +| underline | || +| strike | || +| ins | || +| script | sub / super || +| header | H1 / H2 / h3 / H4 / h5 / H6 || +| align | left / center / right / justify |left百度小程序不支持| +| direction | rtl || +| indent | -1 / +1 || +| list | ordered / bullet / check || +| color | hex color || +| backgroundColor | hex color || +| margin/marginTop/marginBottom/marginLeft/marginRight | css style |百度小程序不支持| +| padding/paddingTop/paddingBottom/paddingLeft/paddingRight | css style |百度小程序不支持| +| font/fontSize/fontStyle/fontVariant/fontWeight/fontFamily | css style |百度小程序不支持| +| lineHeight | css style |百度小程序不支持| +| letterSpacing | css style |百度小程序不支持| +| textDecoration | css style |百度小程序不支持| +| textIndent | css style |百度小程序不支持| +| wordWrap | css style |百度小程序不支持| +| wordBreak | css style |百度小程序不支持| +| whiteSpace | css style |百度小程序不支持| + 对已经应用样式的选区设置会取消样式。css style 表示 css 中规定的允许值。 @@ -134,10 +135,10 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery | 属性 | 类型 | 默认值 | 必填 | 说明 | | --- | --- | --- | --- | --- | -| src | String | | 是 | 图片地址 | +| src | String | | 是 | 图片地址,仅支持 http(s)、base64、本地图片| | alt | String | | 否 | 图像无法显示时的替代文本 | -| width | String | | 否 | 图片宽度(pixels/百分比),2.6.5+ 支持 | -| height | String | | 否 | 图片高度 (pixels/百分比),2.6.5+ 支持| +| width | String | | 否 | 图片宽度(pixels/百分比),2.6.5+ 支持,百度小程序不支持 | +| height | String | | 否 | 图片高度 (pixels/百分比),2.6.5+ 支持,百度小程序不支持| | extClass | String | | 否 | 添加到图片 img 标签上的类名,2.6.5+ 支持 | | data | Object | | 否 | data 被序列化为 name=value;name1=value2 的格式挂在属性 data-custom 上,2.6.5+ 支持 | | success | Function | | 否 | 接口调用成功的回调函数 | @@ -183,6 +184,16 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery | fail | Function | | 否 | 接口调用失败的回调函数 | | complete | Function | | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) | + +**object.success 回调函数** + +| 属性 | 类型 | 说明 | +| --- | --- | --- | +| html | string |带标签的 HTML 内容 | +| text | string |纯文本内容 | +| delta | Object |表示内容的 delta 对象 | + + ## editorContext.clear(OBJECT) 清空编辑器内容 @@ -239,7 +250,7 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery |App|H5|微信小程序|支付宝小程序|百度小程序|字节跳动小程序、飞书小程序|QQ小程序|快手小程序|京东小程序| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:| -|√`HBuilderX 3.0.3`|√`HBuilderX 3.0.3`|√`基础库2.8.3`|x|x|x|x|x|x| +|√`HBuilderX 3.0.3`|√`HBuilderX 3.0.3`|√`基础库2.8.3`|x|√|x|x|x|x| **OBJECT 参数说明** @@ -257,7 +268,7 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery |App|H5|微信小程序|支付宝小程序|百度小程序|字节跳动小程序、飞书小程序|QQ小程序|快手小程序|京东小程序| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:| -|√`HBuilderX 3.0.3`|√`HBuilderX 3.0.3`|√`基础库2.8.3`|x|x|x|x|x|x| +|√`HBuilderX 3.0.3`|√`HBuilderX 3.0.3`|√`基础库2.8.3`|x|√|x|x|x|x| **OBJECT 参数说明** @@ -275,7 +286,7 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery |App|H5|微信小程序|支付宝小程序|百度小程序|字节跳动小程序、飞书小程序|QQ小程序|快手小程序|京东小程序| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:| -|√`HBuilderX 3.0.3`|√`HBuilderX 3.0.3`|√`基础库2.10.2`|x|x|x|x|x|x| +|√`HBuilderX 3.0.3`|√`HBuilderX 3.0.3`|√`基础库2.10.2`|x|√|x|x|x|x| **OBJECT 参数说明** @@ -289,5 +300,5 @@ editor 组件对应的 editorContext 实例,可通过 [uni.createSelectorQuery |参数|类型|说明| |:-|:-|:-| -|errMsg|String|接口调用结果| +|errMsg|String|接口调用结果(百度小程序不支持)| |text|String|纯文本内容| \ No newline at end of file diff --git a/docs/component/editor.md b/docs/component/editor.md index 361ac38a2..1450c85fa 100644 --- a/docs/component/editor.md +++ b/docs/component/editor.md @@ -41,19 +41,19 @@ editor组件目前只有H5、App的vue页面、微信小程序、百度小程序 不满足的标签会被忽略,`
`储存。
-| 类型 | 节点 |
-| --- | --- |
-| 行内元素 | ` ` |
-| 块级元素 | `