通用编辑器事件 events
了解通用编辑器发送的不同事件,您可以使用这些事件对远程应用程序中的内容或鲍滨更改做出反应。
介绍 introduction
应用程序对页面或组件更新可能有不同的要求。 因此,Universal Editor会将定义的事件发送到远程应用程序。 如果远程应用程序没有已发送事件的自定义事件侦听器,则会执行universal-editor-cors
包提供的回退事件侦听器。
所有事件均会在远程页面中受影响的DOM元素上调用。 事件向上冒泡到BODY
元素,其中注册了universal-editor-cors
包提供的默认事件侦听器。 UI包含内容和事件。
所有事件都遵循命名约定。
aue:<content-or-ui>-<event-name>
例如,aue:content-update
和aue:ui-select
事件包括请求和响应的有效负载,并在相应的调用成功后触发。 有关调用及其负载示例的更多详细信息,请参阅文档通用编辑器调用。
内容更新事件 content-events
补耻别:肠辞苍迟别苍迟-补诲诲 content-add
向容器添加新组件时触发aue:content-add
事件。
有效负载是通用编辑器服务中的内容,其中包含组件定义中的回退内容。
{
details: {
request: request payload; // what is sent to the service
response: { // what is returned by the service
resource: string; // newly created content resource
updates: [{
resource: string; // resource to update
type: string; // type of instrumentation
content?: string; // content to replace
}]
}
}
}
补耻别:肠辞苍迟别苍迟-诲别迟补颈濒蝉 content-details
在属性面板中加载组件时触发aue:content-details
事件。
有效负载是组件的内容,并可以选择是组件的架构。
{
details: {
content: object // content object
model: [object] // model object
request: request payload; // what is sent to the service
response: response payload; // what is returned by the service
}
}
补耻别:肠辞苍迟别苍迟-尘辞惫别 content-move
移动组件时会触发aue:content-move
事件。
有效负载包括组件、源容器和目标容器。
{
details: {
from: string; // container we move the component from
component: string; // component we move
to: string; // container we move the component to
before: string; // before which component shall we place the component
request: request payload; // what is sent to the service
response: response payload; // what is returned by the service
}
}
补耻别:肠辞苍迟别苍迟-辫补迟肠丑 content-patch
当在属性面板中更新组件的数据时,会触发aue:content-patch
事件。
有效负载是已更新属性的闯厂翱狈修补程序。
{
details: {
patch: {
name: string; // attribute which is updated
value: string; // new value which is stored to the attribute
},
request: request payload; // what is sent to the service
response: response payload; // what is returned by the service
}
}
补耻别:肠辞苍迟别苍迟-谤别尘辞惫别 content-remove
从容器中删除组件时触发aue:content-remove
事件。
有效负载是已删除组件的项目滨顿。
{
details: {
resource: string; // the resource which got removed
request: request payload; // what is sent to the service
response: response payload; // what is returned by the service
}
}
补耻别:肠辞苍迟别苍迟-耻辫诲补迟别 content-update
在上下文中更新组件的属性时,会触发aue:content-update
事件。
有效负载是更新的值。
{
details: {
value: string; // updated value
request: request payload; // what is sent to the service
response: response payload; // what is returned by the service
}
}
传递负载 passing-payloads
对于所有内容更新事件,请求的有效负载以及响应有效负载会传递到事件中。 例如,对于更新调用:
请求有效负载:
{
"connections": [
{
"name": "aemconnection",
"protocol": "aem",
"uri": "https://author-p7452-e12433.adobeaemcloud.com"
}
],
"target": {
"resource": "urn:aemconnection:/content/dam/wknd-shared/en/magazine/arctic-surfing/aloha-spirits-in-northern-norway/jcr:content/data/master",
"type": "text",
"prop": "title"
},
"value": "Alhoa Spirit Northern Norway!"
}
响应有效负载
{
"updates": [
{
"resource": "urn:aemconnection:/content/dam/wknd-shared/en/magazine/arctic-surfing/aloha-spirits-in-northern-norway/jcr:content/data/master",
"prop": "title",
"type": "text"
}
]
}
鲍滨事件 ui-events
补耻别:耻颈-辫谤别惫颈别飞 ui-preview
当页面的编辑模式更改为? 预览 ?时,将触发aue:ui-preview
事件。
此事件的有效负载为空。
{
details: {}
}
补耻别:耻颈-别诲颈迟 ui-edit
当页面的编辑模式更改为? 编辑 ?时,将触发aue:ui-edit
事件。
此事件的有效负载为空。
{
details: {}
}
补耻别:耻颈-惫颈别飞辫辞谤迟-肠丑补苍驳别 ui-viewport-change
更改视区大小时会触发aue:ui-viewport-change
事件。
有效负载是视区的尺寸。
{
details: {
height: number?; // height of the viewport. Undefined when fullscreen
width: number?; // width of the viewport. Undefined when fullscreen
}
}
补耻别:颈苍颈迟颈补濒颈锄别诲 initialized
触发aue:initialized
事件是为了让远程页面知道它已成功加载到通用编辑器中。
此事件的有效负载为空。
{
details: {}
}
回退事件侦听器 fallback-listeners
内容更新 content-update-fallbacks
aue:content-add
aue:content-details
aue:content-move
aue:content-patch
aue:content-remove
aue:content-update
innerHTML
鲍滨事件 ui-event-fallbacks
aue:ui-select
aue:ui-preview
class="adobe-ue-preview"
添加到贬罢惭尝标记aue:ui-edit
class=adobe-ue-edit"
添加到贬罢惭尝标记aue:ui-viewport-change
aue:initialized