Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
DCloud
unidocs-zh
提交
649ea468
unidocs-zh
项目概览
DCloud
/
unidocs-zh
通知
3598
Star
108
Fork
921
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
120
列表
看板
标记
里程碑
合并请求
109
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
unidocs-zh
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
120
Issue
120
列表
看板
标记
里程碑
合并请求
109
合并请求
109
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
提交
649ea468
编写于
8月 10, 2022
作者:
study夏羽
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
editor百度小程序兼容说明
上级
34ba01c0
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
75 addition
and
64 deletion
+75
-64
docs/api/media/editor-context.md
docs/api/media/editor-context.md
+66
-55
docs/component/editor.md
docs/component/editor.md
+9
-9
未找到文件。
docs/api/media/editor-context.md
浏览文件 @
649ea468
...
...
@@ -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
"
,
"
using
Swan
Components
"
:
{
"
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
docs/component/editor.md
浏览文件 @
649ea468
...
...
@@ -41,19 +41,19 @@ editor组件目前只有H5、App的vue页面、微信小程序、百度小程序
不满足的标签会被忽略,
`<div>`
会被转行为
`<p>`
储存。
| 类型 | 节点 |
| --- | --- |
| 行内元素 |
`<span> <strong> <b> <ins> <em> <i> <u> <a> <del> <s> <sub> <sup> <img>`
|
| 块级元素 |
`<
p> <h1> <h2> <h3> <h4> <h5> <h6> <hr> <ol> <ul> <li>`
|
| 类型 | 节点 |
平台差异说明 |
| --- | --- |
--- |
| 行内元素 |
`<span> <strong> <b> <ins> <em> <i> <u> <a> <del> <s> <sub> <sup> <img>`
|
其中
`<ins> <del> `
百度小程序不支持 |
| 块级元素 |
`<
br> <p> <h1> <h2> <h3> <h4> <h5> <h6> <hr> <ol> <ul> <li>`
|其中
`<br>`
仅百度小程序支持、
`<p>`
百度小程序不支持
|
#### 支持的内联样式
内联样式仅能设置在行内元素或块级元素上,不能同时设置。例如 font-size
` 归类为行内元素属性,在 p 标签上设置是无效的。
| 类型 | 样式 |
| --- | --- |
| 块级样式 | `
text-align
` `
direction
` `
margin
` `
margin-top
` `
margin-left
` `
margin-right
` `
margin-bottom
` `
padding
` `
padding-top
` `
padding-left
` `
padding-right
` `
padding-bottom
` `
line-height
` `
text-indent
` |
| 行内样式 | `
font
` `
font-size
` `
font-style
` `
font-variant
` `
font-weight
` `
font-family
` `
letter-spacing
` `
text-decoration
` `
color
` `
background-color
` |
| 类型 | 样式 |
平台差异说明 |
| --- | --- |
--- |
| 块级样式 | `
text-align
` `
direction
` `
margin
` `
margin-top
` `
margin-left
` `
margin-right
` `
margin-bottom
` `
padding
` `
padding-top
` `
padding-left
` `
padding-right
` `
padding-bottom
` `
line-height
` `
text-indent
` |
百度小程序仅支持`
text-align、direction
`|
| 行内样式 | `
font
` `
font-size
` `
font-style
` `
font-variant
` `
font-weight
` `
font-family
` `
letter-spacing
` `
text-decoration
` `
color
` `
background-color
` |
百度小程序仅支持`
color、background-color
`|
**注意事项**
...
...
@@ -90,7 +90,7 @@ editor组件目前只有H5、App的vue页面、微信小程序、百度小程序
methods: {
onEditorReady() {
// #ifdef MP-BAIDU
this.editorCtx = requireDynamicLib('editorLib').createEditorContext('editor
Id
');
this.editorCtx = requireDynamicLib('editorLib').createEditorContext('editor');
// #endif
// #ifdef APP-PLUS || H5 ||MP-WEIXIN
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录